title: Angular 2 - get child component to load inside parent component(getting created dynamically)
body: <p>I am trying to dynamically create a header, constructing and passing the header template as 'string' to my dynamic component. My requirement is to call another component inside the header component template string and load it.</p>
  
  <p>Have created a working <a href="https://plnkr.co/edit/ENa23Q1Qqtvi46CYnllV?p=preview" rel="nofollow noreferrer">Plunker</a> here for the scenario.</p>
  
  <p>I get an error in the browser console as: </p>
  
  <pre><code>Unhandled Promise rejection: Template parse errors:
  'alert' is not a known element:
  1. If 'alert' is an Angular component, then verify that it is part of this module.
  2. If 'alert' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("     &lt;span class="title" style="float: right; margin-right: 10px;"&gt;
                                  [ERROR -&gt;]&lt;alert&gt;&lt;/alert&gt;   
                                  &lt;img class="notify-circle" src="https://cdn0.iconf"): DynamicComponent@2:32 ; Zone: &lt;root&gt; ; Task: Promise.then ; Value: Object { _nativeError: Error, stack: "" } BaseError@https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:1595:29 [angular]
  </code></pre>
  
  <p><strong>Question:</strong></p>
  
  <p>How can i get the 'Alert' component recognized inside the header template constructed as a string, using the selector <code>'&lt;alert&gt;&lt;/alert&gt;'</code>.</p>
  
  <p>The concept may seem bizarre, but the requirement is such.</p>