Angular2: atrybuty ng-content przechodzące do komponentu potomnego

Question

Czy coś takiego jest możliwe?

Chcę przekazać zmienną "hasfocus" z cjc-box poprzez atrybuty ng-content do komponentu cjc-input.

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}}" /> 

Czy to w ogóle możliwe z prognozami w ng2?

Answer 1

Możliwe jest przekazać zmienną do projektowanej treści (składnik zakładając cjc-box deklaruje nieruchomość focus i komponent cjc-input deklaruje nieruchomość hasfocus):

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

ta jest jednokierunkowa wiążące, jeśli chcesz dwukierunkowej jest nieco bardziej skomplikowane:

• Dodaj @Input() dekorator do focus właściwość elementu pola.
• Dodaj @Input() dekorator do hasfocus właściwość komponentu wejściowego
• Dodaj @Output() hasfocusChange:EventEmitter<any> = new EventEmitter<any>(); do elementu wejściowego.
• Po zmianie zmień komponent wejściowy.
• Zmień szablon na <div cjc-box #box><div cjc-input [(hasfocus)]="box.focus"></div></div>