<p dir="auto">Use of exclamation in an <code class="notranslate">ngIf</code> does not work when using null propagation operator. It worked in beta-15, not in beta-16.</p>
<p dir="auto">See plunker for demo:<br>
<a href="http://plnkr.co/edit/2TGZ2XVESVQQJ1IN39AA?p=preview" rel="nofollow">http://plnkr.co/edit/2TGZ2XVESVQQJ1IN39AA?p=preview</a></p>
<p dir="auto">(change to beta-15 to see difference)</p>
<p dir="auto">Short version:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="    &lt;div *ngIf=&quot;!myData?.myBoolean&quot;&gt;
      &lt;h2&gt;With exclamation&lt;/h2&gt;      &lt;---- does not show
    &lt;/div&gt;
    &lt;div *ngIf=&quot;myData?.myBoolean === false&quot;&gt;
      &lt;h2&gt;With === false&lt;/h2&gt;        &lt;---- shows as expected
    &lt;/div&gt;"><pre class="notranslate"><code class="notranslate">    &lt;div *ngIf="!myData?.myBoolean"&gt;
      &lt;h2&gt;With exclamation&lt;/h2&gt;      &lt;---- does not show
    &lt;/div&gt;
    &lt;div *ngIf="myData?.myBoolean === false"&gt;
      &lt;h2&gt;With === false&lt;/h2&gt;        &lt;---- shows as expected
    &lt;/div&gt;
</code></pre></div>
<p dir="auto">I could not find anything about this in the changelog - is this as designed?</p>
<p dir="auto"><strong>I'm submitting a ...</strong></p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="[x] bug report
[ ] feature request
[ ] support request"><pre class="notranslate"><code class="notranslate">[x] bug report
[ ] feature request
[ ] support request
</code></pre></div>
<p dir="auto"><strong>Current behavior</strong><br>
I am dynamically creating a component (using <code class="notranslate">viewContainer.createComponent</code>) which uses ChangeDetectionStrategy.OnPush and that component instantiates a template provided by the parent component with <code class="notranslate">viewContainerRef.createEmbeddedView(templateRef)</code>. When the parent component updates the template, the dynamically created component does not update.</p>
<p dir="auto"><strong>Expected behavior</strong><br>
It should update</p>
<p dir="auto"><strong>Minimal reproduction of the problem with instructions</strong><br>
Here is a plnkr which has implemented a way to show a callout when clicking on an element. I have hooked up two different callout components (one uses OnPush and one uses Default).</p>
<p dir="auto"><a href="https://plnkr.co/edit/vYCuDwHj64qIp6GEShC9?p=preview" rel="nofollow">https://plnkr.co/edit/vYCuDwHj64qIp6GEShC9?p=preview</a></p>
<p dir="auto"><strong>What is the motivation / use case for changing the behavior?</strong><br>
Right now we're having to use some hacky workarounds which register child change detector refs with the parent components, and having the parent component mark the children for check. Using OnPush is necessary for the performance of our app.</p>
<ul dir="auto">
<li>
<p dir="auto"><strong>Angular version:</strong> 4.0.2</p>
</li>
<li>
<p dir="auto"><strong>Browser:</strong> all</p>
</li>
<li>
<p dir="auto"><strong>Language:</strong> all</p>
</li>
</ul>