Question

我正在编写一个Ember应用程序，用于存储有关位置的“建议”。

用户必须从列表中选择一个位置（由自定义API检索），编写描述，拍照并使用该数据进行POST。

所以我有一个LocationModel和LocationController，它从我的API中检索位置，将其显示在列表中，并允许用户选择其中一个。然后是一个DescriptionController和PhotoController，它允许用户编写描述并拍摄照片。

我需要在各个控制器/模型上拥有每个“部件”，因为我希望它们能够重复使用我最终应用程序的其他部分。

My Recommendation的模型如下所示：

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操作的操作绑定到推荐模板中的元素中，或者只在render内的renderTemplate中添加另一个RecommendationRoute调用}。

希望它有所帮助！

如何连接相关的型号/控制器

1 个答案: