Ember.js：使用没有路由的 ArrayController？

Question

我有一个想要在页面上显示的类别列表。我一直在寻找正确的方法来执行此操作几个小时，但我一直在发现相互冲突的信息和方法，这些信息和方法要么不再适用于当前版本的 Ember，要么已被弃用。

创建应用程序和 Ember-Data 事物：

var App = Ember.Application.create();
App.ApplicationAdapter = DS.FixtureAdapter;

App.Store = DS.Store.extend({
  adapter: 'DS.FixtureAdapter'
});

我正在使用 Ember-Data 和一些类别的固定数据：

App.Category.FIXTURES = [{
  id:          1,
  name:        'Category 1',
  description: 'The first category'
}, {
  id:          2,
  name:        'Category 2',
  description: 'The second category'
}];

然后我创建一个模型来表示一个类别的实例（“版本”与版本实例具有类别实例的不同模型相关）：

App.Category = DS.Model.extend({
  versions:    DS.hasMany('version'),
  name:        DS.attr('string'),
  description: DS.attr('string')
});

然后我制作了一个 ArrayController，但我无法填充内容。

App.CatagoriesController = Ember.ArrayController.create({
  content: [],
  init: function () {
    this.set('content', ???);
  }
});

因为它不可导航，所以它没有连接到路由，所以我不能在路由中使用“模型”属性。

替换 ArrayController 中的???，我尝试了几件事：

我尝试了this.store.find('category')，就像示例中显示的路由一样，但我收到错误“Uncaught TypeError: Cannot read property 'find' of null”。

我尝试了App.Store.find('category')，结果出现错误“Uncaught TypeError: undefined is not a function”。

感谢您向正确方向提供任何帮助或推动。我有一种感觉，我什至没有朝着正确的方向前进。

Answer 1

几件事。

首先，请记住控制器是单例的。因此，您的 init 函数只会在应用程序的整个生命周期内触发一次（这可能不是您想要的）。但这并不重要，因为...

您处理模型的方式与 Ember.js 的设置方式不同。您不应该在控制器中获取模型，而应该只获取路由。这就是控制器上没有store 属性的原因。你需要在你的路由上实现model 钩子，像这样：

App.CategoriesRoute = Ember.Route.extend({
    model: function() {
        return this.store.find('category');
    }
});

从那里，Ember 将自动将控制器上的 model 属性（不是content 属性，不要使用它）设置为从 model 返回的数据钩子。

因此，只需从控制器中删除 content 属性和 init 函数，然后在模型中实现该挂钩，就可以开始了。