模型加载后 Ember.js 不重新渲染模板

Question

我正在使用 Ruby on Rails API 服务器学习 Ember.js。我已经完成了所有设置和工作的路线、模板和模型 - 但是一旦从 API 服务器加载数据，模板就永远不会重新呈现。我没有收到任何错误消息，并且通过查看 Ember 检查器，我知道正在加载客户。

客户列表应该显示在start之后

正在从 API 服务器正确加载客户列表：

路由器

// javacripts/router.js
App.Router.map(function() {
  this.resource('customers', { path: "/" });
});

客户路线

// javascripts/routes/customer_routes.js
App.CustomersRoute = Ember.Route.extend({
  model: function() {
    return this.store.find('customer');
  },
  renderTemplate: function() {
    this.render('customers/index');
  }
});

客户模型

// javascripts/models/customer.js
App.Customer = DS.Model.extend({
  name: DS.attr('string')
});

客户索引模板

// javacripts/templates/customers/index.js.handlebars
<ul>
  <li>start</li>
  {{#each customers}}
    <li>{{name}}</li>
  {{/each}}
</ul>

商店

// javacripts/store.js
App.ApplicationAdapter = DS.ActiveModelAdapter.extend({
  namespace: 'api/v1'
});

Answer 1

代替

{{#each customers}}

应该是这样的

{{#each controller}}
  {{name}}
{{/each}}

或

{{#each customer in controller}}
    {{customer.name}}
{{/each}}

我最近发布了两个截屏视频。一个展示如何开始使用新应用程序，另一个展示如何设置 Grunt：

• https://www.youtube.com/watch?v=T-s34EVSE_0
• https://www.youtube.com/watch?v=kPaHt_F3VcU

您也可以从我今年早些时候的一次演讲中获得一些用处，该演讲通过在演讲中开发一个简单的应用程序，包括 Ember Data。

• https://www.youtube.com/watch?v=KH5RreHtaaQ

Answer 2

您的客户/索引模板引用了一个不存在的“客户”集合。

你的路由的模型钩子返回一个记录数组，这使得 Ember 生成一个 Ember.ArrayController ，其模型设置为你的客户数组。它没有名为“customers”的属性，因此 {{#each customers}} 没有任何可迭代的内容。如果将其更改为 {{#each}}（因为此范围内的 this 引用了控制器，它类似于数组）或 {{#each model}}（显式访问 ArrayController 的模型数组），它应该可以正常工作。

此外，Route 中的 renderTemplate 挂钩是默认行为，因此您可以删除它。

顺便说一句，我建议您在刚开始学习基础知识时只使用Ember JSBin 或其他东西，所以当您需要寻求帮助时，您可以链接到垃圾箱，人们有实时代码他们可以以最少的努力帮助您。进入门槛低对于那些为互联网点免费工作的人来说有很大的不同。