Ember.js Jaka jest różnica między setupController a deklarowaniem <Name> Kontroler

Question

Widzę wiele mylących przykładów w oficjalnych samouczkach Ember.js.

Jednym z przykładów, które tak naprawdę nie podoba to:

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

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

Teraz jak rozumiem mogę napisać to tak, że zamiast:

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

i usunięcie tej setupController z trasy.

Jaki jest cel/korzyść korzystania z setupController?

Answer 1

setupController służy głównie do dynamicznego konfigurowania kontekstu kontrolera. W twoim przykładzie, jeśli tytuł zawsze będzie "Hello world!" dobrze jest ustawić go w deklaracji klasowej.

Domyślnie setupController ustawi właściwość model z controller na wartość zwróconą przez hakowanie trasy model.

Można także ustawić na przykład inny model kontrolera lub ustawić początkowy stan kontrolera zależny od modelu.

Na przykład załóżmy, że masz następujące elementy:

// 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'); } 
}); 

Szablon:

<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}} 

A potem zdecydować, że byłoby miło, aby włączyć tryb edycji domyślnie postow z autoEdit równa się true. Prawdopodobnie będziesz chciał to zrobić w trasie (od kontrolera, gdy instancja, nie wie nic na temat modelu):

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

Więc w zasadzie, to dla „inicjalizacji” kontroler (ustawienie modelu i stan domyślny) .