14

我在 Ember.js 官方教程中看到了很多令人困惑的例子。

我真的不喜欢的一个例子是：

App.ApplicationRoute = Ember.Route.extend({
    setupController: function(controller) {
        controller.set('title', "Hello world!");
    }
});

App.ApplicationController = Ember.Controller.extend({
    appName: 'My First Example'
});

现在据我了解，我可以这样写：

App.ApplicationController = Ember.Controller.extend({
    appName: 'My First Example',
    title: 'Hello world!'
});

并删除setupControllerfrom 路线。

使用的目的/好处是setupController什么？

4

1 回答 1

23

setupController主要用于动态设置一些控制器上下文。在您的示例中，如果标题始终是“Hello world！” 可以在类声明中设置它。

默认情况下，setupController将model属性设置为从路由的钩子controller返回的值。model

例如，您也可以设置另一个控制器的模型，或设置一些取决于模型的初始控制器状态。

例如，假设您有以下内容：

// Model
App.Post = DS.Model.extend({
  title: DS.attr('string'),
  text: DS.attr('string'),
  autoEdit: DS.attr('string')
});

// Controller
App.PostController = Ember.ObjectController.extend({
  isEditing: null,
  toggleEdit: function() { this.toggleProperty('isEditing'); }
});

模板：

<a href="#" {{action 'toggleEdit'}}>Toggle edit mode</a>

{{#if isEditing}}
  {{input type="text" value=title placeholder="Title"}}
  {{textarea type="text" value=text placeholder="Text"}}
{{else}}
  <h1>{{title}}<h1>
  <article>{{text}}</article>
{{/if}}

autoEdit然后，您决定默认为等于的帖子打开编辑模式会很好true。您可能希望在路由中执行此操作（因为控制器在实例化时对模型一无所知）：

App.PostRoute = Ember.Route.extend({
  setupController: function(controller, model) {
    this._super(controller, model);
    if (model.get('autoEdit')) {
      controller.set('isEditing', true);
    }
  }
});

所以基本上，它是为了“初始化”控制器（设置模型和默认状态）。

于 2013-07-26T11:30:33.230 回答