angular - 通过类选择器渲染 Angular2 组件

Question

我的问题很简单，但请相信我，几个小时以来我一直在努力思考这个问题。

有一个要通过类选择器实例化的组件。

@Component({
  selector: '.mycomponent',
  template: '<h1>hello!</h1>'
})
export class MyComponent{}

假设父组件如下所示:

@Component({
  ...
  template:
      `
        <div class="mycomponent"></div> <!-- rendered -->
        <div [class]="'mycomponent'"></div> <!-- not rendered -->
      `
})
export class ParentComponent{}

为什么从不渲染第二个版本？我将如何让它渲染？这是一个变化检测问题还是它不应该以这种方式工作？我试过更改检测策略，但没有任何效果。我也遇到过 DynamicComponentLoader。我希望我可以使用它。

有没有办法通过非元素选择器动态加载组件？

Answer 1

那是行不通的。组件和指令仅适用于静态添加的标签、属性和类。

如果您想动态添加/删除组件和指令，请使用 DynamicComponentLoader或 ViewContainerRef 的 createComponent()