当没有路线存在时,链接视图,控制器和模型的正确习惯是什么?

时间:2013-11-21 18:44:52

标签: ember.js

我知道EmberJS建议使用Routes将模型,视图和控制器连接在一起,这对于设置页面的主要内容非常方便。但是假设我有一个侧边栏,它将显示来自第二个来源的信息。例如rss feed。或者附加到某些服务器统计信息的状态面板, 我想要一个可以添加到连接到单独模型的任何模板{{view MessageView}}的视图。

这样做的“余烬方式”是什么。

到目前为止,我能做的最好的事情是让显式的View和Controller对象覆盖init函数,将它们连接在一起。 例如:

/*
 * The messages class is a free floating list of messages that can be plugged into any page. 
 * it is implemented as a view with a separate controller and model.
 * As its not associated with a route we need to bind the view, controller and model together directly using 
 * init statements.
 */

/**************************
* Model
**************************/

App.Message = DS.Model.extend({
    msg: DS.attr('string'),
    author: DS.attr('string'),
    date: DS.attr('date'),
    display_class: DS.attr('string')
});


/**************************
* Route
**************************/

//App.MessageRoute = Ember.Route.extend({
//  model : function() {
//      return this.get('store').findAll('message');
//      }
//});


/**************************
* Views
**************************/
App.MessageView = Em.View.extend({
      init: function() {
//          this._super();
            this.set("controller", App.MessageController.create());
          },

    });


/**************************
* Controllers
**************************/
App.MessageController = Em.ArrayController.extend({
      init: function() {
//          this._super();
            this.set("model", model : function() {
                return this.get('store').findAll('message');
            });
          },

});


/**************************
* Fixture
**************************/
App.Message.FIXTURES = [{
      id: 1,
      msg: "App website will be down for maintenance for 4 hours on Friday 29th Nov",
      author: { name: "Admin" },
      date: new Date('2013-11-18T19:00:00Z'),
      display_class: 'warning'
    }, {
      id: 2,
      msg: "Tropical Cyclone may affect North Island net week [read more](http://www.bom.gov.au/cyclone/)",
      author: { name: "WeatherMan" },
      date: new Date('2013-11-18'),
    }, 
    ];

然而,我真正需要的是一些方法来重现Route函数已经完成的工作。

有更好的方法吗?

是否有一个具有多个独立视图区域的仪表板样式页面的示例?

谢谢Andrew

1 个答案:

答案 0 :(得分:2)

Ember方式将模型,控制器和放大器连接在一起没有路线的视图是{{render}}{{control}}。 (您也可以使用{{render}} 一条路线,如果您覆盖路线的renderTemplate挂钩则不做任何事情。)

当您说{{render 'message'}}时,Ember将实例化MessageControllerMessageView并将其连接起来。

要连接到模型,您有两种选择:如果模型可以更改,或者有多个“消息”视图,您可以将模型传递给渲染:{{render 'message' someMessage}}。或者,如果您想确保一次只显示一条消息并处理将其加载到某个地方的路径中,您可以这样做:

this.controllerFor('message').set('model', someMessage);

在知道someMessage应该是什么的路由的setupController挂钩中。这可能是ApplicationRoute。您也可以在应用程序初始化程序中执行此操作,但我认为将其放在ApplicationRoute中更灵活,更明确/可维护。

请注意,如果检索someMessage的代码是一个promise,则需要在promise的then中的控制器上设置它。