Ember.js路由器/控制器属性

Question

我试图绕着model财产或路线与content控制器的属性进行包围.如果model在路径中设置属性,它是否会自动将其设置content为生成的控制器中的属性.

另外,我认为content控制器的属性允许您访问模板中该对象的属性,这是真的吗？

我阅读了文档,但仍然难以消化其中的一些约定.

Answer 1

正如这里所回答的,它Ember.Route有一个model函数,允许您将对象或对象集合设置为该路径的模型.处理单个对象的路由应该具有扩展的控制器,Ember.ObjectController而处理对象集合的路由应该具有扩展的控制器Ember.ArrayController.随后,在Route工作流程中,来自model钩子的数据content通过setupController钩子设置到控制器的属性中.

路由有自己的工作流来设置其控制器,因此默认情况下将调用此方法并使用模型填充内容.考虑以下:

小提琴

App.Email = DS.Model.extend({
    address: DS.attr('string'),
    isActive: DS.attr('boolean')
});

App.Router.map(function() {
    this.resource('emails', function() {
        this.route('email', {path: ':email_id'});
    });
});

App.EmailsRoute = Ember.Route.extend({
    model: function() {
        return App.Email.find();
    }
});
App.EmailRoute = Ember.Route.extend({
    model: function(params) {
        return App.Email.find(params.email_id);
    }
});

App.EmailsController = Ember.ArrayController.extend();
App.EmailController = Ember.ObjectController.extend();

框架应为这些路由生成默认代码,以便设置控制器,如下所示(如果需要,可以覆盖):

App.EmailsRoute = Ember.Route.extend({
    ...
    setupController: function(controller, model) {
        controller.set('content', model);
    }
    ...
});

有些情况(请参阅上面链接的问题/答案),您可能需要/想要覆盖这些方法以执行与默认功能不同的操作,例如:

小提琴

App.EmailsRoute = Ember.Route.extend({
    model: function(params) {
        return [{id: 1, address: 'other@email.com'}];
    },
    setupController: function(controller, model) {
        // here, controller is whatever controller this route needs
        // by conventions, it knows it should be EmailsController
        // of the type ArrayController
        // model is whatever was returned by the model function above

        // the content is a "bag" which can be filled with a model or any
        // other object you need. Just keep in mind your view layer will
        // be referring to this object later on
        controller.set('content', model);

        // you can set other properties of the controller here too
        controller.set('applyFilter', true);
    }
});

现在,模板将能够访问控制器中的数据.下面的例子迭代了一个对象(App.Email)的集合EmailsController.此处可以访问此集合或其子对象中的任何公共属性,例如{{email.address}}:

<script type="text/x-handlebars" data-template-name="emails">
    <ul>
    {{#each email in controller}}
        <li>
            {{#linkTo emails.email email}}
                {{email.address}}
            {{/linkTo}}
        </li>    
    {{/each}}
    </ul>
    {{outlet}}
</script>

请注意,模板不直接与模型对话,而是content与模型中的数据一起分配.就像我说的那样,你可以通过路由存储内容或模型中的任何对象,因此你不依赖于使用,DS.Model也不会强烈耦合体系结构.

如果这个模型而不是App.Email类型具有不同类型和不同属性,那么它也可以在这里访问,但有限制.如果模型的属性是集合,则无法通过索引访问(例如{{email.messages[0].body}},不起作用).在这种情况下,最好的操作方法是控制器中的计算属性,它可以让您直接访问电子邮件的第一项消息集合(如果有的话).