EmberJS registerHelper 在 Ember 1.8 中动态渲染模板 [英] EmberJS registerHelper to dynamically render a template in Ember 1.8

问题描述

我想动态呈现模板，如下所示:

I'd like to dynamically render a template, like this:

{{#each layout in layouts}}
   {{render layout.get('type') layout}}
{{/each}} 

问题是 render 不希望变量作为它的第一个参数，因此在较旧的 EmberJS 版本中，可以通过注册帮助程序来解决:

The problem is that render doesn't expect a variable as its first arguments, so in the older EmberJS-versions, a workaround was possible by registering a helper:

Ember.Handlebars.registerBoundHelper('render_layout', 
  function(callingContext, layout, options) {
    return Ember.Handlebars.helpers.render.call(callingContext, 
                layout.get('type'), 'layout', options);
});

并在模板中:

{{#each layout in layouts}}
     {{render_layout this layout}}
{{/each}} 

不幸的是，这个东西在较新的 ember 版本中不起作用.Ember.Handlebars.helpers.render.call 需要 3 个参数，但我无法正确设置它们.有任何想法吗?我试过了:(this, layout.get('type'), options)

Unfortunately the thing doesn't work in newer ember versions. Ember.Handlebars.helpers.render.call expects 3 arguments but I can not get them right. Any ideas? I've tried: (this, layout.get('type'), options)

并在模板中:

{{#each layout in layouts}}
     {{render_layout layout}}
{{/each}} 

我得到 Uncaught TypeError: Cannot read property 'pushChildView' of null

...以及许多其他人.

... and many others.

任何建议将不胜感激.

推荐答案

组件允许您指定 layoutName.并且您可以根据传递给组件的参数动态计算布局名称.

Components allow you to specify layoutName. And you can dynamically compute the layout name based on a parameter passed into the component.

App.XRenderComponent = Ember.Component.extend({
  tagName: "",
  layoutName: function(){
    return this.get('displayLayout.type'); 
  }.property('displayLayout'),
});

然后你就可以了

  <script type="text/x-handlebars" id="index">
    {{#each layout in model}}
      {{ x-render displayLayout=layout }}
    {{/each}}   
  </script>

查看工作示例此处

这篇关于EmberJS registerHelper 在 Ember 1.8 中动态渲染模板的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！