<p dir="auto">I have a "dynamic" component that is loaded through a <code class="notranslate">DynamicComponentLoader</code>. In that dynamic component I'm trying to set a template variable. But for some reason this doesn't seem to get parsed by Angular. Eventhough the exact same thing works fine from the "main" component.</p>
<p dir="auto">Here is an example of my problem: <a href="http://plnkr.co/edit/38mf2kWzH16RjTNcyLEO?p=preview" rel="nofollow">http://plnkr.co/edit/38mf2kWzH16RjTNcyLEO?p=preview</a></p>
<p dir="auto">You should see two texts. A text in a <code class="notranslate">h2</code> tag, which has a dynamic <code class="notranslate">id</code> attribute. This <code class="notranslate">id</code> attribute is successfully parsed</p>
<p dir="auto">Then the <code class="notranslate">Dynamic</code> component is loaded underneath that <code class="notranslate">h2</code> element. The <code class="notranslate">div</code> that says <strong>_I should have a dynamic ID</strong>_ has no <code class="notranslate">id</code> attribute anymore. For some reason the variable isn't parsed. Even worse, the entire <code class="notranslate">id</code> tag disappeared.</p>
<p dir="auto">Bug?</p>
<p dir="auto"><strong>I'm submitting a ...</strong>  (check one with "x")</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="[x ] bug report =&gt; search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request =&gt; Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question"><pre class="notranslate"><code class="notranslate">[x ] bug report =&gt; search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request =&gt; Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question
</code></pre></div>
<p dir="auto"><strong>Current behavior</strong><br>
{{ '9999-12-31T23:59:59Z' : date:'short'}} =&gt; page errors out without an error in the console<br>
{{ '9998-12-31T23:59:59Z' : date:'short'}} =&gt; formats to 1/1/9999 12:59 PM</p>
<p dir="auto"><strong>Expected behavior</strong><br>
{{ '9999-12-31T23:59:59Z' : date:'short'}} =&gt; 1/1/9999, 12:59 PM<br>
{{ '9998-12-31T23:59:59Z' : date:'short'}} =&gt; 1/1/10000, 12:59 PM</p>
<p dir="auto">(current behaviour in Chrome)</p>
<p dir="auto"><strong>Minimal reproduction of the problem with instructions</strong><br>
Plunkr to replicate it: <a href="https://plnkr.co/edit/xTi4YetvG8ASlS7vPdg3?p=preview" rel="nofollow">https://plnkr.co/edit/xTi4YetvG8ASlS7vPdg3?p=preview</a></p>
<p dir="auto"><strong>What is the motivation / use case for changing the behavior?</strong><br>
Browser consistency</p>
<p dir="auto"><strong>Please tell us about your environment:</strong><br>
Windows 10</p>
<ul dir="auto">
<li>
<p dir="auto"><strong>Angular version:</strong> 2.2.4</p>
</li>
<li>
<p dir="auto"><strong>Browser:</strong> [IE11 | Edge ]</p>
</li>
</ul>

<ul dir="auto">
<li><strong>Language:</strong> [TypeScript 2.0.3]</li>
</ul>