Parent variable not working inside of ng-content
<p><strong>Intro:</strong> I'm working on ng2 components whose structure looks like this:</p>

<pre><code>&lt;cards&gt;
  &lt;card&gt;
    &lt;card-content-type-1 (state)="cardState"&gt;&lt;/card-content-type-1&gt;
  &lt;/card&gt;
  &lt;card&gt;
    &lt;card-content-type-2 (state)="cardState"&gt;&lt;/card-content-type-2&gt;
  &lt;/card&gt;
  &lt;card&gt;
    &lt;card-content-type-3 (state)="cardState"&gt;&lt;/card-content-type-3&gt;
  &lt;/card&gt;
  ...
&lt;/cards&gt;
</code></pre>

<p>And I'm changing states of each <code>&lt;card&gt;</code> based on click/mouseenter/mouseleave events, and when some action happen inside of <code>&lt;card&gt;</code> component (parent component), based on current state, I'd like to trigger some animation methods inside <code>&lt;card-content-type-N&gt;</code> components (children component). For sequence of animations I'll use <code>AnimationBuilder</code> and <code>ElementRef</code>.</p>

<hr>

<p><strong>Issue:</strong> I decided to pass parent component variable to children component, and to implement <code>ngOnChanges()</code> inside of children, which will trigger specific animation depends of current variable value. But I have troubles to pass parent variable to children when I use ng-content inside of parent template.</p>

<p>I created simplified example (I replaced <code>&lt;card&gt;</code> with <code>&lt;parent-comp&gt;</code>, and <code>&lt;card-content-type-N&gt;</code> with <code>&lt;child-comp&gt;</code>): <a href="https://plnkr.co/edit/OHIJjMwdx6ifRiSxsanB?p=preview" rel="nofollow">https://plnkr.co/edit/OHIJjMwdx6ifRiSxsanB?p=preview</a></p>

<p>In this example <code>parentVar</code> is not passed into the <code>child-comp</code>. Is this some bug in Angular2 or I'm doing something wrong? I suppose that is related with <code>ng-content</code> scope, but we lack good docs/examples about this.</p>

<p>In same example inside of <code>src/parent-comp.ts</code> if we replace intial template with <code>&lt;child-comp [childVar]="parentVar"&gt;&lt;/child-comp&gt;</code> parent variable is passed properly.</p>

<p>Also inside of <code>src/app.ts</code> if we replace initial template with  this:</p>

<pre><code>&lt;parent-comp&gt;
  &lt;child-comp [childVar]="true"&gt;&lt;/child-comp&gt;
&lt;/parent-comp&gt;
</code></pre>

<p>static variable is passed properly.</p>

<p>Does someone have a similar issue? Or have idea how I can solve this issue?</p>