typescript - Hur får man komponentselektorns namn inuti en Directive? Angular 4


Jag försökte få selektorns namn inuti Direktivet, jag är inte heller säker på om det är möjligt eller hur man gör det.

<my-component1 *myDir="Var"> </my-component1>
<my-component2 *myDir="Var"> </my-component2>
<my-component3 *myDir="Var"> </my-component3>

Jag använder samma direktiv på flera komponenter som ges ovan, nu behöver jag få det aktuella komponentens selector-namn inne i direktivet som nedan. Snälla, någon, säg hur man får selector-namnet inne i direktivet

@Directive({
  selector : '[myDir]

'
    })

    export class MyDirDirective {
       constructor (){
         this.currentSelector  = getCurrentComponentSelector;
       }
    }
     @Input() set myDir(value:any){
      if(this.currentSelector==='my-component1'){
          i will do some action, display or not decide
      }
    }

Svar #1

Du bör använda ElementRef och få taggnamnet

constructor(private el: ElementRef) {
  const selector = el.nativeElement.tagName;
}

ngOnInit() {
  const selector = this.el.nativeElement.tagName;
}

(Jag är inte säker på att det skulle fungera i konstruktorn, så testa båda metoderna)

Svar #2

Detta är en renare lösning som kommer att fungera med AOT och när du är utanför den aktuella komponenten:

const components = [ MyComponent ];
/*
  ...
  Anything that can be injected into
*/
constructor(private componentFactoryResolver: ComponentFactoryResolver) {
  // Loop through each component
  components.forEach(element => {
    // Get its resolved factory
    const factory = this.componentFactoryResolver.resolveComponentFactory(element);

    console.log('Factory:', factory);
    console.log('Selector:', factory.selector);
  });
}