我尝试使用knockout.js模板创建HTML表格,其中要绑定的属性的名称是非常动态的,并且作为JSON从服务器返回。
JSON的格式如下:
{"Columns": [
{"Title": "First Name", "Bind": "Person.FirstName"},
{"Title": "Last Name", "Bind": "Person.LastName"},
{"Title": "Birth Date", "Bind": "Person.DOB"}
],
"Rows": [
{
"Person": {
"FirstName": "James",
"LastName": "Jameson",
"DOB": "5/7/1965"
},
"Person": {
"FirstName": "Bob",
"LastName": "Bobson",
"DOB": "12/15/1976"
}
}
]
}
鉴于此JSON,我想创建一个生成以下HTML的模板:
<table>
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Birth Date</th>
</tr>
</thead>
<tbody>
<tr>
<td>James</td>
<td>Jameson</td>
<td>5/7/1965</td>
</tr>
<tr>
<td>Bob</td>
<td>Bobson</td>
<td>12/15/1976</td>
</tr>
</tbody>
<table>
我知道如何使用调用javascript函数的自定义html绑定或通过在服务器上创建HTML并对其应用绑定来实现此目的,但我更倾向于使用模板。
据我所知,这是淘汰赛的一个奇怪用途,但JSON来自服务器,其格式可以在运行时更改。
感谢您的帮助。
答案 0 :(得分:0)
Knockout与其他MVVM实现一样,允许您使用带有特定标记的模板,这些模板可以让淘汰赛知道在哪里插入数据。
我们使用类似的Kendo MVVM。我们使用ajax调用将模板加载到视图中以检索模板html并将模板绑定到视图模型。我们根本不使用脚本标签。
这篇文章介绍了如何使用Knockout
执行此操作