繁体   English   中英

问题迭代模板中的Ember.js对象

[英]Issue Iterating Over Ember.js Object in Template

我在模板中的Ember.js中迭代一个对象和数组时遇到了问题。 我确定这是我实现Handlebars迭代器的一种方式,但我似乎无法弄明白。

Records = {

    data: [
            [
                recordID: "1234",
                recordName: "Record Name"
            ],
            [
                recordID: "1235",
                recordName: "Record Name 5"
            ],
            [
                recordID: "1236",
                recordName: "Record Name 6"
            ]
          ],
    otherInformation: "Other Info",
    moreInformation: "More Information"
}

然后我有模板输出,看起来像这样......

{{#each Records.data}}
    {{this}}
{{/each}}

这只给了我数据数组中的第一条记录,但我希望能够访问每个数组和子数组中的每个键,以便输出特定的值。

您的Record.data数组似乎不正确,您有两个嵌套数组,具有不正确的对象声明。 我使用这个工作:

使用Javascript

Records={
    data: [
        {
            recordID: "1234",
            recordName: "Record Name"
        },
        {
            recordID: "1235",
            recordName: "Record Name 5"
        },
        {
            recordID: "1236",
            recordName: "Record Name 6"
        }
    ],
    otherInformation: "Other Info",
    moreInformation: "More Information"
}

模板

  {{#each Records.data}}
    {{recordID}}
  {{/each}}

请看看http://jsfiddle.net/marciojunior/m7khc/

正如Marcio Rodrigues所说,你的数组文字是无效的。

//编辑以澄清:javascript数组可以包含对象。 对象是基元,数组,文字符号或函数中的对象。 您试图将键值对插入到数组中,这两者都不是。

在嵌套数组中,你有一个键值对,它不能独立存在,它必须包含在一个对象文字中。 如果你肯定想保留嵌套数组结构并将属性作为数组中的元素,那么一种方法就是这样做

Records = {
    data: [
        [
            { aKey: "recordID", aValue: "1234" },
            { aKey: "recordName", aValue: "Record Name XY" },
        ],
        [
            { aKey: "recordID", aValue: "12356" },
            { aKey: "recordName", aValue: "Record Name AB" },
        ]
    ],
    otherInformation: "Other Info",
    moreInformation: "More Information"
}

然后,在您的模板中,您可以迭代:

<script type="text/x-handlebars" data-template-name="index">  
  {{#each record in Records.data}}
    {{#each attributePair in record}}
      {{attributePair.aKey}}:{{attributePair.aValue}}
      <br />
    {{/each}}
  {{/each}}
</script>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM