Emberjs 数组控制器答案

【问题标题】：Emberjs array controllerEmberjs 数组控制器
【发布时间】：2015-08-07 03:43:15
【问题描述】：

我的路线是：

export default Ember.Route.extend({
    model: function (params) {
        var blocks = this.store.find('block', {'objectId': 777});
        this.controllerFor("blocks").set('model', blocks);
        return Ember.RSVP.hash({
            object: this.store.find('object', params.id),
            blocks: blocks
        });
        //return this.store.find('object', params.id);
    }
});

我的控制器是：

export default Ember.ArrayController.extend({
    init: function(e){
        alert('jere');
    }
});

初始化函数中的警报有效，但接下来我收到错误：

处理路由时出错：objects.bc.index 无法读取属性 'length' of null TypeError: 无法读取属性'length' of null

通过 ajax 获取模型集合并使用自定义数组控制器在模板中显示它的正确方法是什么？

【问题讨论】：

这是一个完整的示例，展示了如何使用带有香草（ish）ajax 的 ArrayController。 @torazaburo 的 cmets 关于哈希与数组（模型）是正确的，但这应该让你滚动（它基于 ember-cli）。 github.com/toranb/async-kanban-board-store-example

标签： javascript ember.js arraycollection

【解决方案1】：

这段代码有很多问题。首先，ArrayController 假设它的模型是一个数组，而您的 model 钩子返回一个哈希值。其次，您的this.controllerFor("blocks").set('model', blocks) 调用尝试将控制器的模型设置为承诺，这是无用的。您不要像这样在model 钩子中设置控制器的模型。您可以通过返回模型来设置它，然后通过您的（或默认的）setupController 钩子将模型安装（在它解析之后）到控制器中。

您不应该使用ArrayController，无论如何它很快就会被弃用，而应使用普通的旧控制器。此控制器的模型将是从 model 挂钩返回的哈希值。您需要在模板中使用{{model}} 显式访问它。

所以你想要这样的东西：

// route.js
export default Ember.Route.extend({
    model: function(params) {
        var blocks = this.store.find('block', {'objectId': 777});
        return Ember.RSVP.hash({
            object: this.store.find('object', params.id),
            blocks: blocks
        });
    }
});

// controller.js
export default Ember.Controller.extend({
    init: function(e) {
        alert('jere');
    }
});

在您的模板中，而不是

{{#each controller}}
    blockProp is {{blockProp}}

正如你现在可能正在做的那样，使用

{{#each block in model.blocks}}
    blockProp is {{block.blockProp}}
{{/each}}
And objectProp is {{model.object.objectProp}}

【讨论】：

{{#each block as model.blocks}} 应该是{{#each model.blocks as |block|}}