eckig 2 binden an Komponentenselektor

Question

Ich habe eine Komponente, die ich ausgeblendet werden muss, wenn eine Eigenschaft wahr ist. Gibt es eine Möglichkeit, dies innerhalb der Komponente selbst zu lösen?

Beispiel:

@Component({ 
    selector: 'prio-tab', 
    changeDetection: ChangeDetectionStrategy.OnPush, 
    template: 
    ` 
     <div [hidden]="!active"> 
     stuff 
     </div> 
    ` 
}) 

export class PrioTabComponent { 
    @Input() title; 
    active:boolean = false; 
} 

Hier würde Ich mag das eigentliche "Prio-Register" Element haben, auf aktiv-Flag abhängig zu sein. Nicht nur der Inhalt in prio-tab.

Oder ist es vielleicht möglich, sich selbst zu verwenden, wenn die Prio-tab-Tag, wie dies erklärt:

<prio-tab [hidden]="this.active"> 
    stuff 
</prio-tab> 

ich eine funktionierende Lösung erraten einen Verweis auf die Prio-Registerkarte Komponente in ihrer Mutter schaffen würde und dann durch die Eltern gehen. Aber wie würde ich tun, wenn ich mehrere prio-Tabs habe?

Answer 1

können Sie @HostBinding()

export class PrioTabComponent { 
    @Input() title; 

    @HostBinding('hidden') 
    active:boolean = false; 
}