javascript - 恩伯斯 : How to render a view with the view name in variable?

Question

我想在板上添加一些卡片，所有卡片都非常不同。所以我想为每张可以绑定(bind)不同事件和模板的卡片创建不同的 View 。我在卡片模型中设置了一个“类型”属性来区分卡片。

看板模板如下所示:

{{#each card in cards}}
  {{render card.type card class="card"}}
{{/each}}

但是，渲染帮助的第一个参数不能是变量，它只能是卡片 View 名称字符串。

有人知道怎么实现吗？

Answer 1

正如您已经提到的，内置的 render 助手只接受一个字符串来查找要呈现的模板，因此一种可能的解决方案是编写您自己的自定义 render助手，然后在使用 card.get('type') 获得正确的名称后，将渲染委托(delegate)给内置的 render 助手。这可能看起来像这样:

Ember.Handlebars.registerBoundHelper('renderCard', function(context, card, options) {
  return Ember.Handlebars.helpers.render.call(context, card.get('type'), 'card', options);
});

之后，您可以在模板中像这样使用它:

{{#each card in cards}}
  {{renderCard this card}}
{{/each}}

编辑

我还添加了一个基本的 jsbin这表明它有效。

编辑2

再次编辑 jsbin，使用要渲染到模板中的对象数据，see here .

编辑3

遗憾的是 DS.FixtureAdapter 不支持 embedded 记录，而这是您需要使其工作的。但是您可以像这样配置您的原始 DS.RESTAdapter:

App.Adapter = DS.RESTAdapter.extend();

App.Adapter.map('App.Dashboard',
  cards: {embedded: 'always'}
);

App.Store = DS.Store.extend({
  adapter: App.Adapter
});

这样，card 记录将始终 与父记录一起加载。我想做这个改变会让你的 handlebar helper 调用 card.get('type') 返回值而不是 undefined。

希望对您有所帮助。