HTML代码如下:
[HTML] 纯文本查看 复制代码 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- 加入模板工具 -->
<script src="./js/template-web.js"></script>
<title>用户信息管理</title>
</head>
<body>
<h2>用户信息管理</h2>
<p>
<a href="/">主页</a> <a href="#">添加</a>
</p>
<table>
<thead>
<tr>
<th>ID</th>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
<th>身高</th>
<th>电话</th>
<th>地址</th>
<th>操作</th>
</tr>
</thead>
<!-- 下面是数据体 -->
<tbody id="content"></tbody>
<!-- 下面是循环体 -->
<script type="text/html" id="dataList">
{{each data}}
<tr>
<th>{{$value.id}}</th>
<th>{{$value.name}}</th>
<th>{{$value.sex}}</th>
<th>{{$value.age}}</th>
<th>{{$value.height}}</th>
<th>{{$value.phone}}</th>
<th>{{$value.address}}</th>
<th>
<a href="/show?id={{data.id}}" id="show">查看</a>
<a href="/edit?id={{data.id}}" id="edit">编辑</a>
<a href="/delete?id={{data.id}}" id="delete">删除</a>
</th>
</tr>
{{/each}}
</script>
</table>
</body>
</html>
<script>
var data = [
{
"id": "1001",
"name": "张三",
"sex": "男",
"age": "32",
"height": "175",
"phone": "13320998888",
"address": "中国大地方"
},
{
"id": "1002",
"name": "李四",
"sex": "男",
"age": "37",
"height": "165",
"phone": "13012345566",
"address": "中国很大地方"
}
];
var htmls = template("datalist", data);
document.getElementById("content").innerHTML = htmls;
</script>
我看手册说明,这样是正确的啊,但是始终是报如下错误,数据无法实现渲染,页面没有数据内容。由于是自己学习,确实找不到地方去问了,看能不能请教一下这里的大神。可能有点基础,请大神多多指教,不要见笑!不胜感谢了啊!
下面是浏览器控制台报错内容,大概就是没有找到模板,无法读取一个空值的value属性
[HTML] 纯文本查看 复制代码 Uncaught TemplateError: template not found: Cannot read properties of null (reading 'value')
但是确实搞了几天了,头都大了,没有找出问题所在,用的是最新的art-template模板,文件名为:template-web.js
|