车把不在Emberjs的数组上循环

时间:2014-09-11 05:59:11

标签: javascript ember.js handlebars.js

我从服务器

中检索了这个JSON对象
    { 
        "Totals": {
            "TotalNotifications": 10,
            "TotalUnreadNotifications": 5
        },
        "NotificationData": [{
            "NotificationId": 1,
            "NotificationType": "Alert",
            "NotificationName": "Low Battery",
            "NotificationDate": "2014-09-08T19:38:57.659",
            "NotificationRead": false,
            "NotificationActive": true,
            "AlertData": {
                "AlertType": "Battery",
                "AlertSeverity": "Critical"
                }
        }, {
            "NotificationId": 2,
            "NotificationType": "Dtcprimary",
            "NotificationName": "Mass or Volume Air Flow",
            "NotificationDate": "2014-09-01T12:00:00.000",
            "NotificationRead": false,
            "NotificationActive": true,
            "DtcData": {
                "DtcCode": "P0101",
                "Vehicle": "2000 Cadillac Deville 4.6L",
                "DtcDescription": "Mass or Volume Air Flow A Circuit Range Performance",
                "ShortDescription": "Ceat ame aut placcat doluptus, quo berum quiandae quid quissim agnimus danimol uptae. Neque si omnis sequo torabori tem nobitatet arcit aut incimaxim fugia sitatium",
                "IdentifixId": "Click <a target=\"_blank\" href=\"https://www.google.com\">here</a> to request a list of top fixes."
                }
        }, {
            "NotificationId": 3,
            "NotificationType": "Dtcsecondary",
            "NotificationName": "Mass or Volume Air Flow",
            "NotificationDate": "2014-08-01T12:00:00.000",
            "NotificationRead": true,
            "NotificationActive": false,
            "DtcData": {
                "DtcCode": "P0101",
                "Vehicle": "2000 Cadillac Deville 4.6L",
                "DtcDescription": "Mass or Volume Air Flow A Circuit Range Performance",
                "ShortDescription": "Ceat ame aut placcat doluptus, quo berum quiandae quid quissim agnimus danimol uptae. Neque si omnis sequo torabori tem nobitatet arcit aut incimaxim fugia sitatium",
                "TopReportedFix": "Replace Air Intake Boot",
                "FrequentlyReportedFixes": "<ul><li>Cleaned Mass Air Flow (MAF) Sensor</li><li>Programmed Powertrain Control Module (PCM)</li></ul>",
                "AlsoReportedFixes": "<ul><li>Cleaned Mass Air Flow (MAF) Sensor</li><li>Cleaned throttle body</li><li>Flushed fuel tank w/P0171, P0174</li></ul>"
                }
        }, {
            "NotificationId": 4,
            "NotificationType": "Recall",
            "NotificationName": "Mass or Volume Air Flow A Circuit Range Performance",
            "NotificationDate": "2014-09-01T12:00:00.000",
            "NotificationRead": false,
            "NotificationActive": true,
            "RecallId": 31234
        }]
    }

当我遍历Notification对象时,没有任何反应。当我尝试常规把手时,它可以正常工作http://jsbin.com/lemafe/1/edit

以下是我在Emberjs组件中循环的方式。 items是传递到组件后的属性名称。

{{alerts-dashboard items=model}}

{{#each items}}
{{Totals.TotalUnreadNotifications}} // this outputs the number 5 as expected
{{#each NotificationData}}
{{NotificationId}} //this doesn't get outputted because the loop never happens
{{/each}}
{{/each}}

为什么它不能在Emberjs中运作?

1 个答案:

答案 0 :(得分:0)

您需要使用{{#each item in items}}

{{#each item in items}}
  {{item.Totals.TotalUnreadNotifications}}
  {{#each item.NotificationData}}
    {{NotificationId}}
  {{/each}}
{{/each}}

我创建了一个JSBin example

修改

以下是我的edited JSBin,显示如果您使用notificationData的小写名称(如this related answer中所述),我也可以在此处找到它。

{{#each model}}
  <li>{{Totals.TotalUnreadNotifications}}</li>
  <ul>
  {{#each notificationData}}
    <li>Type: {{NotificationType}}</li>
  {{/each}}
  </ul>
{{/each}}