1

我正在使用带有最新 ember-data 和最新 Ember.js (RC5) 的 REST 适配器

我有Module以下映射的模型：

DS.Model.extend({
    type: DS.attr('string'),
    url: DS.attr('string'),
    text: DS.attr('string'),
    header: DS.attr('string')
});

针对返回 JSON 的 API：

{
    "status": "success",
    "modules": [{
        "id": "123456",
        "type": "video",
        "url": "http://some.where.com/video.mp4"
    }, {
        "id": "123457",
        "type": "text",
        "text": "Lorem ipsum dolor sit amet ..."
    }, {
        "id": "123458",
        "type": "feedback",
        "header": "Indtast noget feedback til os."
    }]
}
  • 如您所见，模块有不同的类型。
  • 可以有许多具有相同类型的对象。
  • 模块是数组中的对象，因为顺序很重要。

我遇到的问题是如何在模板中表示它们？我需要为它们中的每一个创建不同的视图，但是在车把中没有这样的东西，比如 if type === video then（只有布尔值，如果这让我担心我会以错误的方式解决问题）呈现不同的视图：

if type === video
{{view moduleVideo}}

if type === text
{{view moduleText}}

if type === feedback
{{view moduleFeedback}}

如何为不同的类型渲染不同的视图？还是有更多的 Ember.js 方式来设计这样的东西？

4

1 回答 1

1

您上面的开关类型结构的类似物是在您的模型上定义识别属性。

App.Module = DS.Model.extend({

    // ...

    isVideo: function() {
        return this.get('type') === 'video';
    }.property('type'),

    isText: function() {
        return this.get('type') === 'text';
    }.property('text'),

    // ...

});

在您的模板中，您现在有布尔值：

{{#if isVideo}}
    {{view moduleVideo}}
{{/if}}

{{#if isText}}
    {{view moduleText}}
{{/if}}

这可行，但由于两个原因是不可取的：

  1. 每种类型都需要一个新的计算属性。
  2. 您最终会在模板中得到一个巨大的条件列表。

解决这个问题的一种方法可能是制作一个 Handlebars 助手来替换{{render}}它，它使用模型的类型来根据命名约定选择合适的控制器/视图/模板。

另一种方法是为您的模型提供一个计算属性以呈现其输出，然后使用三把手绑定将其转储到您的模板中。然后，您可以针对不同的子类以不同的方式覆盖输出属性。这适用于 Ember Data 的多态性。

编辑：

这是我上面试图描述的一个 jsfiddle。

于 2013-06-06T22:11:47.920 回答