Question

我从服务器发送了以下json，我一直试图用jsrender进行迭代但没有成功

{
"1": {
    "username": "one",
    "sent_email": false,
    "group": "blogger",
    "date_activated": null,
    "activated_email": false,
    "email": "email",
    "date_registered": null,
    "key": "key",
    "password": "password",
    "id": 1
},
"2": {
    "username": "Madawar",
    "sent_email": true,
    "group": "admin",
    "date_activated": "2012-07-17T00:00:00",
    "activated_email": true,
    "email": "dennis.wanyoike@gmail.com",
    "date_registered": "2012-08-22T11:21:39",
    "key": "e4hVRItub_A=",
    "password": "$2a$12$F3aBLpF.MyyiVDAocPzE9uJn0K5DZ1V4qRim54wl8f3tEv.7VC4ji",
    "id": 2
},
"3": {
    "username": "one",
    "sent_email": false,
    "group": "blogger",
    "date_activated": null,
    "activated_email": false,
    "email": "email",
    "date_registered": null,
    "key": "key",
    "password": "password",
    "id": 3
},
"4": {
    "username": "one",
    "sent_email": false,
    "group": "blogger",
    "date_activated": null,
    "activated_email": false,
    "email": "email",
    "date_registered": null,
    "key": "key",
    "password": "password",
    "id": 4
},
"5": {
    "username": "one",
    "sent_email": false,
    "group": "blogger",
    "date_activated": null,
    "activated_email": false,
    "email": "email",
    "date_registered": null,
    "key": "key",
    "password": "password",
    "id": 5
},
"6": {
    "username": "one",
    "sent_email": false,
    "group": "blogger",
    "date_activated": null,
    "activated_email": false,
    "email": "email",
    "date_registered": null,
    "key": "key",
    "password": "password",
    "id": 6
},
"7": {
    "username": "one",
    "sent_email": false,
    "group": "blogger",
    "date_activated": null,
    "activated_email": false,
    "email": "email",
    "date_registered": null,
    "key": "key",
    "password": "password",
    "id": 7
},
"10": {
    "username": "Madawar12",
    "sent_email": true,
    "group": "blogger",
    "date_activated": null,
    "activated_email": false,
    "email": "dennis.wanyoike@gmail12.com",
    "date_registered": "2012-08-30T17:13:07",
    "key": "JehBfVpoheE=",
    "password": "$2a$12$V04xpEqCWSLIWl0rte2U7OQC5/TqFcDehKJiuiqRALiW3uEYTBFsK",
    "id": 10
},
"11": {
    "username": null,
    "sent_email": true,
    "group": "blogger",
    "date_activated": null,
    "activated_email": false,
    "email": null,
    "date_registered": "2012-08-30T17:16:32",
    "key": "MG7kgSUzNK0=",
    "password": "$2a$12$6gJa1L0MZn9HB/fZNk1cXe1RDjAIOaAv1ASTgBJu.OrhOMpNfCkOG",
    "id": 11
},
"12": {
    "username": null,
    "sent_email": true,
    "group": "blogger",
    "date_activated": null,
    "activated_email": false,
    "email": null,
    "date_registered": "2012-08-30T17:17:30",
    "key": "qJisSUS8osQ=",
    "password": "$2a$12$tfDdBODJFTz/afhAvm7EjOpH.Zp.Q8Jw.h312uFZCwJQTlKRI0k6G",
    "id": 12
}

}

数字1-12表示记录编号，不一定是顺序编号，是否可以使用jsrender显示此记录，还是必须从服务器更改结果？

Answer 1

为了给你一些想法，请看一下这个sample，它展示了JsRender中迭代字段的几种方法。您可以将这些方法应用于您的方案。（现场演示是here）。

更新：当前的文档位于：http://www.jsviews.com/#propstag。

对于迭代到任何深度，您确实可以在递归使用的模板或标记中使用{{props}} - 因此遍历数组和对象的层次结构到任何深度。

有一个{{jsonview/}}代码coded here可以做到这一点，并在this jsfiddle sample中使用，例如......

在这种情况下，它使用数据链接，因此当您在“树”中以任何方式更改数据时，jsonview输出将逐步更新。只有JsRender可以使用相同的{{jsonview}}。（如果需要，您可以在此方案中将数据链接的{^{...}}代码更改为{{...}}。）

Answer 2

您可以将其呈现如下

var collection = json
$ .each（集合，函数（键，值）{
警报（键+“-----”+值）;
$ .each（value，function（k，v）{alert（k +“++++++++++++++++）+）; }）;

Answer 3

我使用了@ BorisMoore的答案并制作了一个模板，只需将JSON中的所有内容放入表中：

<script type="text/x-jsrender" id="prooops">
  <table>
    {{props #data}}
      <tr>
        <td>{{>key}}</td>
        <td>
          {{props prop}}
            {{>key}}: {{>prop}}<br/>
          {{/props}}
        </td>
      </tr>
    {{/props}}
  </table>
</script>

Here是一个jsFiddle，向您展示它是如何工作的。

公平地说这是一个4岁的问题，我怀疑你还有这个问题。只是把它放在这里向后代展示它是如何完成的

使用Jsrender迭代嵌套的json模型

3 个答案: