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

Question

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

<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;    
}

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

Angular2, How to get the current active component selector to use it as class globally for css styling

angular2-template

angular