javascript - {{#each objects}} 对比 {{#each model.objects}} 对比 {{#each content.objects}}

Question

我写了一个非常简单的路由，导出一个带有子集合的对象作为它的模型:

App.IndexRoute = Ember.Route.extend({
    model: function() {
        return Ember.Object.create({
            objects: [...]
        });
    }
});

现在在我的模板中，我尝试像这样迭代对象:

{{#each objects}}
    ...
{{/each}}

出于某种原因，这在官方的 ember jsfiddle 中有效，但是当我在本地运行相同的代码时，我必须将其更改为 {{#each content.objects}} 才能使其正常工作。我发现我的案例和 jsfiddle 之间的唯一区别是:

1. 我使用 browserify + hbsify 来编译模板，而不是使用内联 handlebars 模板
2. 我不定义应用程序模板，而 jsfiddle 定义。

我错过了什么？

Answer 1

我可以解释这 3 者之间的区别，希望这能让事情变得更清楚一些。

• {{#each objects}} - 这从 Controller 上的 objects 属性中提取。如果您明确定义了一个名为 objects 的属性，它将使用该属性。但是，如果您没有明确定义一个(我假设是这种情况)，则 Controller (从 ObjectProxy 扩展)会将请求代理到 content 属性。

  因此，首先 Ember 调用 controller.get('objects')，它将返回 undefined，因为您没有定义 objects 属性.从那里，将调用 unknownProperty 函数，该函数将返回 content.objects 的内容。

  最重要的是，使用此表单将根据您的 Controller 声明方式而有所不同。尽可能避免这种情况。

• {{#each model.objects}} - model 实际上是 content 的别名，但从技术上讲你不是应该知道的。 content 属性只是 Ember 对象代理如何工作的一个实现细节。

  最后，只要知道 model 保存您当前的模型，您应该更喜欢这种访问属性的方法。 (因为在我看来，它消除了歧义。)

• {{#each content.objects}} - content 是 Ember 对象代理的实现细节。在这种特殊情况下，content 是您提供的模型。您应该避免使用此方法，因为它依赖于要命名为 content 的对象代理的属性(技术上随时可能更改)。

因此对于您的问题，我认为 {{#each objects}} 不起作用，因为以某种方式定义了另一个 objects 属性。您应该改用 {{#each model.objects}}。 (或者，如果可以，切换到 ArrayController 并只使用 {{#each}}。