angular - Parent variable not working inside of ng-content -


intro: i'm working on ng2 components structure looks this:

<cards>   <card>     <card-content-type-1 (state)="cardstate"></card-content-type-1>   </card>   <card>     <card-content-type-2 (state)="cardstate"></card-content-type-2>   </card>   <card>     <card-content-type-3 (state)="cardstate"></card-content-type-3>   </card>   ... </cards> 

and i'm changing states of each <card> based on click/mouseenter/mouseleave events, , when action happen inside of <card> component (parent component), based on current state, i'd trigger animation methods inside <card-content-type-n> components (children component). sequence of animations i'll use animationbuilder , elementref.


issue: decided pass parent component variable children component, , implement ngonchanges() inside of children, trigger specific animation depends of current variable value. have troubles pass parent variable children when use ng-content inside of parent template.

i created simplified example (i replaced <card> <parent-comp>, , <card-content-type-n> <child-comp>): https://plnkr.co/edit/ohijjmwdx6ifrisxsanb?p=preview

in example parentvar not passed child-comp. bug in angular2 or i'm doing wrong? suppose related ng-content scope, lack docs/examples this.

in same example inside of src/parent-comp.ts if replace intial template <child-comp [childvar]="parentvar"></child-comp> parent variable passed properly.

also inside of src/app.ts if replace initial template this:

<parent-comp>   <child-comp [childvar]="true"></child-comp> </parent-comp> 

static variable passed properly.

does have similar issue? or have idea how can solve issue?

you can try this:

<parent-comp #parent>   <child-comp [childvar]="parent.parentvar"></child-comp> </parent-comp> 

here plunkr https://plnkr.co/edit/rvmruocy2mhtl4ytmvio?p=preview


Comments

Popular posts from this blog

PySide and Qt Properties: Connecting signals from Python to QML -

c# - DevExpress.Wpf.Grid.InfiniteGridSizeException was unhandled -

scala - 'wrong top statement declaration' when using slick in IntelliJ -