如何渲染角度2中的子类组件？

我有一个主类，模块，它是由许多子类如TextOnlyModule或ImageOnlyModule扩展。我有一个包含模块数组的预览组件。如何渲染角度2中的子类组件？

这里有一个小图：

我想，在预览模板，以呈现其子类模板的每个模块。在下面的例子中，模块是一个模块数组，我喜欢用某个模板呈现每个模块，而不直接调用每个选择器，因为我不知道Module子类型。

<div *NgFor="#module in modules"> 
    {{module}} 
</div>

有没有办法做到这一点？

谢谢。

来源

2016-01-14 gavard.e

也许你可以使用DynamicComponentLoader类做编程的Preview组件内：

@Component({ 
    (...) 
    template: ` 
    <div #someContainer></div> 
    ` 
}) 
export class Preview { 
    constructor(dcl:DynamicComponentLoader,eltRef:ElementRef) { 
    this.modules = ... 

    this.modules.forEach((module) => { 
     dcl.loadIntoLocation(module, eltRef, 'someContainer'); 
    }); 
    } 
}

下面是一些plunkr：https://plnkr.co/edit/UtVpvnTHPiR675lztOcQ?p=preview。

希望它可以帮助你，蒂埃里

来源

2016-01-14 15:22:27

我目前使用的角度2.0.0 beta.0而据我可以看到，有上渲染没有loadIntoLocation方法。看来setElementProperty是最接近的一个。我试图用这样的： this.modules.forEach（（模块）=> { renderer.setElementProperty（eltRef， “元素”，模块）; }）与我的模板：

但它似乎根本不工作 –

哦，你是对的。我犯了一个错误：它是'Renderer'类，但是'DynamicComponentLoader'一个...我更新了我的答案;-)对不起！ –

再次感谢您的帮助Thierry。我遇到另一个困难。这可能'loadIntoLocation'与一个instancied对象，而不是它的'Type'？我无法在api文档中找到它 –

如何渲染角度2中的子类组件？

回答

相关问题