Angular2，如何获取当前活动组件选择器以将其作为全局类用于 css 样式

Question

我想为每个组件应用样式，我正在寻找的是我想获取当前的组件选择器名称并将其作为类名传递，如下所示

<div [class]="component-slector-name">
<router-outlet></router-outlet>
</div>

这样对于每个活动组件，我都会得到它的选择器并将其设置为 div 标签以自定义 css 样式..

有谁知道如何做到这一点 ？？提前感谢您的时间和支持。

Answer 1

有不同的方法来实现它。

这是一种选择：

*.html

<div [class]="activeSelector">
  <router-outlet (activate)="onActivated($event)"></router-outlet>
</div>

*.ts

activeSelector: string;

constructor(private resolver: ComponentFactoryResolver) {}

onActivated(component) {
  this.activeSelector = 
        this.resolver.resolveComponentFactory(component.constructor).selector;    
}