Ember.js 模板未迭代 {{#each}}答案

【问题标题】：Ember.js template not iterating over {{#each}}Ember.js 模板未迭代 {{#each}}
【发布时间】：2016-05-25 16:14:46
【问题描述】：

我有一个运行 {{#each}} 循环的 Ember.js 车把模板来迭代返回的商店数据。商店里只有一条记录，所以我希望这段代码会被执行 1 次。但是，它根本没有执行，我似乎无法弄清楚为什么。这是 .hbs 代码：

{{#each model.framework as |framework|}} 
  {{#paper-item noink=true}}
    <p class="question">
      {{paper-input label="Question" required=true value=detail}}
    </p>
    <p class="option">
      {{#paper-radio value="text" selected=type}}Text{{/paper-radio}} 
      {{#paper-radio value="radio" selected=type}}Options{{/paper-radio}} 

      {{#paper-button action=(action "newQuestion" framework.id) raised=true}}Add Question{{/paper-button}}
    </p>
  {{/paper-item}} 
{{/each}}

这个{{#each}} 循环应该在我的商店中呈现来自这个查询的数据（来自这个页面的我的routes.js 文件）：

model(params) {
  var id = params.framework_id;
  return Ember.RSVP.hash({
    question: this.store.query('question', {orderBy: 'framework', equalTo: id}),
    framework: this.store.find('framework', id)
  })
}

而且我知道存储的路由和查询工作正常，因为我尝试迭代的框架通过 Ember 检查器位于数据存储中：

Ember.js Inspector Data

页面上还有其他{{#each}} 循环（用于“问题”商店）没有问题。任何想法表示赞赏。

【问题讨论】：

标签： javascript ember.js

【解决方案1】：

model.framework 是您使用 store.find 从后端检索的单个对象：

return Ember.RSVP.hash({
  question: this.store.query('question', {orderBy: 'framework', equalTo: id}),
  framework: this.store.find('framework', id) // <-- This returns an object
})

但是，正如Ember Docs 解释的那样：

{{#each}} 助手循环遍历集合中的元素。

这意味着不能循环遍历单个对象，因为它不是集合。您需要删除 {{each}} 助手并使用 model.framework 而不是 framework：

{{#paper-item noink=true}}
  <p class="question">
    {{paper-input label="Question" required=true value=detail}}
  </p>
  <p class="option">
    {{#paper-radio value="text" selected=type}}Text{{/paper-radio}}
    {{#paper-radio value="radio" selected=type}}Options{{/paper-radio}}

    {{#paper-button action=(action "newQuestion" model.framework.id) raised=true}}Add Question{{/paper-button}}
  </p>
{{/paper-item}}

如果您想循环遍历对象属性，可以查看each-in helper

【讨论】：