Angular2: ng-content-Attribute, die an die untergeordnete Komponente übergeben werden

Question

Ist so etwas möglich?

Ich möchte eine "hasfocus" Variable von CJC-Box über ng-Content-Attribute an die CJC-Input-Komponente übergeben.

app.component.html

<div cjc-box><div cjc-input></div></div> 

cic-box.component.html

<div class="cjc-box"> 
    <div><ng-content hasfocus="focus"></ng-content></div> 
</div> 

cic-input.component.html

<input class="cjc-input" type="text" focus="{{hasfocus}}" /> 

Ist dies überhaupt möglich mit Vorsprüngen in ng2?

Answer 1

Es ist möglich, Variable projizierten Inhalte passieren (vorausgesetzt Komponente cjc-box erklärt Eigenschaft focus und Komponente cjc-input erklärt Eigenschaft hasfocus):

<div cjc-box #box><div cjc-input [hasfocus]="box.focus"></div></div> 

Dies wird Einbahn Bindung, wenn Sie es zwei-Wege wollen, ist etwas komplexer:

• hinzufügen @Input() Dekorateur focus Eigentum der Box-Komponente.
• hinzufügen @Input() Dekorateur hasfocus Eigenschaft der Eingabekomponente
• @Output() hasfocusChange:EventEmitter<any> = new EventEmitter<any>(); zur Eingabekomponente hinzufügen.
• Fügen Sie this.hasfocusChange.emit(this.hasfocus); nach hasfocus Änderung in Ihrer Eingabekomponente hinzu.
• Template ändern zu <div cjc-box #box><div cjc-input [(hasfocus)]="box.focus"></div></div>