如何获得Angular2在innerHTML的绑定组件 [英] How to get Angular2 to bind component in innerHTML

问题描述

我要创建对myApp 组件将从属性在模板中的控制器上嵌入HTML。然而，一些HTML可能包括其他组件选择

I want to create a component myApp that will embed HTML from a property on the controller in its template. However, some of that HTML may include other component selectors.

import {InfoComponent} from ...
@Component({
    selector: 'myApp',
    template: `<div [innerHTML]='hData'></div>
               <myInfo></myInfo>`,
    directives: [InfoComponent]
})
export class AppComponent {
   hData = "<myInfo></myInfo>";
}

@Component({
   selector: 'myInfo',
   template: "<b>This is a test</b>"
})
export class InfoComponent {
}

在这个例子中，我希望看到这是一个测试显示两次。然而，它不会出现该Angular2发动机上的事实，即元器件的选择器已经注入拿起以便永远不会被用于＆下生成的模板; MyInfo的＆GT;＆下; / MyInfo的＆GT; 选择器，通过添加绑定。

In this example, I would expect to see This is a test displayed twice. However, it doesn't appear that the Angular2 engine picks up on the fact that the selector of the Component has been injected so the template never gets generated for the <myInfo></myInfo> selector that is add via the binding.

您可以在这里看到一个演示。

You can see a demo here.

有没有办法让Angular2在它与在模板中明确添加选择做同样的方式解析选择？

Is there a way to get Angular2 to parse the selector in the same way it does with the selector that is added explicitly in the template?

推荐答案

有没有办法让 [innerHTML的] =...实例角组件或指令或建立任何绑定。

There is no way to make [innerHtml]="..." instantiate Angular components or directives or establish any bindings.

最近的这个要求是 DynamicComponentLoader 。

这篇关于如何获得Angular2在innerHTML的绑定组件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！