Question

我正在使用render帮助器来创建通过在控制器中定义content方法来获取自己的数据的小部件：

{{render "popular_posts"}}

App.PopularPostsController = Ember.ArrayController.extend({
    content: function () {
        return this.store.find('post', { order_by: 'views', per: 5 };
    }.property()
})

这很好用，但帖子可以被标记，当我在特定标签的页面上时，我想重复使用相同的小部件，但是我需要将标签传递给它以显示仅有的帖子特定标签。

目前我从父控制器获取标签，如果存在，我将其添加到请求查询参数中。但是，像这样渲染（不传递模型对象）会导致PopularPostsController成为单例，因此它会在每个页面上显示相同的数据。

我可以将它改为像这样的非单身：

App.register(
    'controller:popular_posts',
    App.PopularPostsController,
    {singleton: false}
);

并且它可以工作，但是能够将数据传递给render帮助器而不是模型（在我的情况下为tag）会很棒。有没有办法做到这一点？

Answer 1

Render采用第二个参数，即您希望渲染控制器使用的模型。＆＃34;模型＆＃34;没有什么特别之处。你传递给渲染，你可以传递任何东西（例如，一个对象，一个对象数组等）

所以你应该能够做到：

{{render "popularPosts" tags}}

这将使用popular_posts模板并实例化PopularPostsController，并将模型设置为您的标记数组。然后，您可以像平常一样访问popular_posts模板中的tags：

{{#each}}
    {{this}} <!-- this refers to a tag -->
{{/each}}

如果您向{{render}}提供模型，那么{[render}}将实例化控制器的新实例而不是使用单例，因此您不需要指定PopularPostsController不是单例

<强>更新

以下是有关如何根据您的评论使用自包含组件构建窗口小部件的一些信息。

组件很不错，因为您可以在自定义组件上设置一堆参数，如下所示：

{{my-component tag=tag sortOrder=sortOrder sortColumn=sortColumn}}

（注意组件名称是dasherized而不是camelCase）

在组件本身中，您可以根据传入的参数获取数据，如下所示：

App.MyComponent = Ember.Component.extend({
    getData: function(){
       var tag = this.get('tag');
       var sortOrder = this.get('sortOrder');
       var sortColumn = this.get('sortColumn');
       //make your ajax call here to retrieve data           
       this.set('posts', dataFromAjax);
    }.on("init")
});

不是使用on事件样式，您也可以像这样覆盖init：

App.MyComponent = Ember.Component.extend({
    init: function(){
       this._super(); //don't forget to call the parent init if you use this method 
       var tag = this.get('tag');
       var sortOrder = this.get('sortOrder');
       var sortColumn = this.get('sortColumn');
       //make your ajax call here to retrieve data           
       this.set('posts', dataFromAjax);
    }
});

使用组件时绑定参数（{{render}}不可用），因此您可以观察sortOrder和sortColumn上的更改，以使用{{1}更改帖子的排序顺序}}：

Ember.computed.sort

这篇内容丰富的博客文章提供了有关使用Ember.Computed.sort的更多信息：

http://balinterdi.com/2014/03/05/sorting-arrays-in-ember-dot-js-by-various-criteria.html

像往常一样，余烬指南实际上非常好，我建议快速查看它：

http://emberjs.com/guides/components/

是否可以将非模型数据传递给渲染助手？

1 个答案: