如何連線相關型號/控制器

Question

我在寫一個Ember應用程序來存儲有關位置的「建議」。

用戶必須從列表中選擇一個位置（由自定義API檢索），編寫描述，拍攝照片並使用該數據進行POST。

所以我有一個LocationModel和LocationController，它從我的API中檢索位置，將它顯示在列表中，並允許用戶選擇其中的一個。 然後一個DescriptionController和PhotoController，允許用戶寫描述並拍攝照片。

我需要在各個控制器/模型上擁有這些「部件」中的每一個，因爲我希望它們可以在我最終應用的其他部分上重複使用。

我的建議的模式是這樣的：

App.RecommendationModel = DS.Model.extend({ 
    location: DS.BelongsTo('location'), 
    description: DS.BelongsTo('description'), 
    photo: DS.BelongsTo('photo') 
}); 

相應的推薦模板：

<section id="select-location"> 
    {{render "location" location}} 
</section> 
<section id="write-description"> 
    {{render "description" description}} 
</section> 
<section id="take-photo"> 
    {{render "photo" photo}} 
</section> 
<section id="send-recommendation"> 
    {{render "share"}} 
</section> 

每個 '部分' 與一個 '完整' 的行動按鈕：

例如：

App.DescriptionController = Ember.Controller.extend({ 
    actions: { 
    complete: function() { 
     _saveDescription(this.get('value')); 
    } 
    } 
}); 

我的問題是如何「組裝」這些零件以實現RecommendationModel。

我認爲整個行動應該是這樣的：

App.DescriptionController = Ember.Controller.extend({ 
    actions: { 
    complete: function() { 
     recommendation.set('description', this); 
    } 
    } 
}); 

應該「完整」的行動是在RecommendationController呢？如果是這樣，我應該如何連接每個組件？

任何其他方法，將不勝感激。

謝謝！

Answer 1

我認爲'全球'complete行動應該由RecommendationController處理，每個控制器（說明，照片和其他）應該處理每個complete行動。

你可以做的是使用needs屬性中的每個處理該建議的一部分控制器：

needs: ['recommendation'], 

，使RecommendationRoute設置和使用這樣的表彰的每一個部分的每一個控制器和模板：

App.RecommendationRoute = Ember.Route.extend({ 

    setupController: function(controller, model) { 
     this._super(); 
     var descController = this.controllerFor('description').set('content', model.get('description')); 
     var photoController = this.controllerFor('photo').set('content', model.get('photo')); 
     this.set('descController', descController).set('photoController', photoController); 
     ... 
    }, 

    renderTemplate: function() { 
     this._super(); 
     this.render('description', { 
      into: 'application', 
      outlet: 'description', 
      controller: this.get('descController') 
     });  
     this.render('photo', { 
      into: 'application', 
      outlet: 'photo', 
      controller: this.get('photoController') 
     }); 
    } 


}); 

這種方式，推薦可以處理其complete行動的一部分的每個控制器。所有使用相同的recommendation模型，他們可以撥打RecommendationController必要時這樣的：

this.get('controllers.recommendation') 

例如，你可以這樣做，以使complete行動一旦該建議的所有部分已經完成。

最後，您可以將綁定在「全球」 complete動作的動作在推薦的模板中的元素，或者只是在RecommendationRoute裏面添加renderTemplate另一個render電話。

希望它有幫助！