如何通过变量动态调用 ember 组件? [英] how can I invoke an ember component dynamically via a variable?

问题描述

假设我的控制器上有一个小部件对象数组，每个小部件对象都有一个成员变量，该成员变量被分配了一个组件类的名称.如何让我的模板调用该组件?

Lets say I have an array of widget objects on my controller and each widget object has member variable that is assigned the name of a component class. How can I get my template to invoke that component?

//widgets[0].widget.componentClass="blog-post"

{{#each widget in widgets}}
    {{widget.componentClass}}
{{/each}}

显然，上面的例子只是吐出了一系列小部件组件类的字符串版本.然而，这确实有效(只要你把一切设置正确):

Obviously the above example just spits out a series of string versions of the widget component classes. This however does work (as long as you got everything set up right):

//widgets[0].widgets.viewClass="blogPost"

{{#each widget in widgets}}
    {{view widget.viewClass}}
{{/each}

这是我们之前的实施，但我们对此并不满意.我们目前正在使用自定义 {{renderWidget ...}} 标签和把手帮助器，如下所述:使用变量名调用 Handlebars {{render}}.默认渲染助手有一个类似的问题，它不会对变量名称的内容调用渲染.我愿意编写一个自定义组件把手助手，但我什至不知道从哪里开始.谢谢.

That was our previous implementation, but we weren't happy with it. We're currently using a custom {{renderWidget ...}} tag with a handlebars helper as described here: Calling Handlebars {{render}} with a variable name. The default render helper has a similar problem where it would not invoke a render on the contents of a variable name. I'd be willing to write a custom component handlebars helper but I can't even figure out where to start. Thanks.

推荐答案

在 Ember 1.11 中，new component helper 允许你这样做:

In Ember 1.11, the new component helper allows you to do this:

{{#each widget in widgets}}
  {{component widget.componentClass}}
{{/each}}

截至今天，2015 年 1 月 19 日，1.11 不是稳定版本，但此功能在 金丝雀版本.

As of today, Jan 19th, 2015, 1.11 is not a stable release but this feature is in the canary version.

这篇关于如何通过变量动态调用 ember 组件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！