<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="[ ] bug report
[x] 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">[ ] bug report
[x] 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></p>
<p dir="auto">If a subclass component has any field marked <code class="notranslate">@ViewChild</code>, any other <code class="notranslate">@ViewChild</code> field in an abstract superclass will not evaluate.</p>
<p dir="auto"><strong>Expected/desired behavior</strong></p>
<p dir="auto">Both the superclass <code class="notranslate">@ViewChild</code> and the subclass <code class="notranslate">@ViewChild</code> should be populated.</p>
<p dir="auto"><strong>Reproduction of the problem</strong></p>
<p dir="auto"><a href="https://plnkr.co/edit/w5EvslQbHMMVqjx8v52U" rel="nofollow">https://plnkr.co/edit/w5EvslQbHMMVqjx8v52U</a></p>
<p dir="auto">The superclass <code class="notranslate">@ViewChild</code> <strong>does populate</strong> from the subclass template, but only if the subclass <code class="notranslate">@ViewChild</code> is commented out.</p>
<p dir="auto">If uncommented, the subclass <code class="notranslate">@ViewChild</code> is populated, but the superclass one is not.</p>
<p dir="auto"><strong>What is the expected behavior?</strong></p>
<p dir="auto">Both the superclass <code class="notranslate">@ViewChild</code> and the subclass <code class="notranslate">@ViewChild</code> should be populated.</p>
<p dir="auto"><strong>What is the motivation / use case for changing the behavior?</strong></p>
<p dir="auto">Multiple components that inherit common code but supply their own template.  The linked plunkr demonstrates the use case where the abstract class encapsulates all the code and logic for the common feature of performing a search, while the child component provides the specific template in which the <code class="notranslate">#searchInput</code> element can be found and whatever other divergent behavior.</p>
<p dir="auto"><strong>Please tell us about your environment:</strong></p>
<ul dir="auto">
<li><strong>Angular version:</strong> 2.0.0-rc.4</li>
<li><strong>Browser:</strong> Chrome 51</li>
<li><strong>Language:</strong> TypeScript 1.8</li>
</ul>
<p dir="auto">The repo is using system.js <code class="notranslate">0.18</code>, but still on systemjs-builder <code class="notranslate">0.10</code> (roughly corresponding to system 0.16). There has been a number of breaking changes in the way path configuration works, so this is not be trivial - <a href="https://github.com/systemjs/builder">https://github.com/systemjs/builder</a>.</p>
<p dir="auto">// cc <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/IgorMinar/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/IgorMinar">@IgorMinar</a> <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/pkozlowski-opensource/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/pkozlowski-opensource">@pkozlowski-opensource</a></p>