javascript - 使用 Ember {{each}} 渲染数组

Question

路线 /numbers 具有 JavaScript:

// app/routes/numbers.js
// ...
numbers: [1,2,3,4,5],
// ...

在路线模板中:

<!-- app/templates/numbers.hbs -->
{{#each numbers as |n|}}
  <p>{{n}}</p>
{{/each}}

<小时/>

当我查看 /numbers 路由时，{{each}} 帮助器内没有呈现任何内容。为什么不呢？

Answer 1

您无法访问在模板的路由中设置的属性。如果您想访问模板中的数字数组，则需要使用 setupController 在 Controller 中设置它。

将数据传递给模板的“Ember方式”是在路由的model钩子(Hook)中获取数据，然后在setupController中将其设置在 Controller 上

在您的 route ，执行以下操作:

model: function(params, transition) {
  return this.get('numbers');
},

setupController: function(controller, model) {
  controller.set('model', model);
}

然后在您的模板中，不要访问数字数组，而是使用model

{{#each model as |n|}}
  <p>{{n}}</p>
{{/each}}

有关更多信息，请阅读:https://guides.emberjs.com/v2.6.0/routing/specifying-a-routes-model/