Richtlinie Attribut binden kann nicht an eine Host-Komponente Eigenschaft

Question

Ich habe dies:

<my-cmp input> 
    hello 
</my-cmp> 

my-cmp hat @Input() disabled und input ist eine weitere Richtlinie wie:

@Directive({ 
    selector: '[input]', 
    host:{ 
    '[disabled]': 'true' 
    } 
}) 

Warum ist es beschweren, dass disabled ist nicht als Eingabe in my-cmp deklariert?

Grundsätzlich möchte ich eine Direktive, die einige Bindungen auf das Hostelement anwendet.

Here ist die plunkr

Answer 1

Ihr Problem ist, dass Ihre Richtlinie nur für eine Art von Komponente funktioniert, und es ist nicht, wie Richtlinien verwendet werden sollen.

Wenn Sie input Anweisung zu einem Div hinzufügen, wird es nicht funktionieren, da disabled keine bekannte native Eigenschaft ist. Gleiches gilt für Ihre Komponente. Ich denke, weil die Direktiven vor den Komponenten geladen sind.

Um dies zu beheben, sollten Sie richtig Ihre disabled-Attribut verwenden:

<my-cmp [disabled]="true"> 
    hello 
</my-cmp> 

N. B: Sie können auch einen Tippfehler auf MyComponent gemacht, @Directive@Component sein sollte und ein template Attribut haben.

Answer 2

Sie müssen nur eckige Klammern vom Host entfernen:

@Directive({ 
    selector: '[input]', 
    host:{ 
     'disabled': 'true' 
    } 
}) 

Plunker