title: Angular2, evaluate template from string inside a component
body: <p>It's possible evaluate template from string in a variable?. I need place the string in the component instead of the expression,
   e.g. </p>
  
  <p><code>template: "&lt;div&gt;{{ template_string }}&lt;/div&gt;"</code></p>
  
  <p><em>template_string</em> contains: <code>&lt;b&gt;{{ name }}&lt;/b&gt;</code> </p>
  
  <p>and all should be evaluated to <code>&lt;div&gt;&lt;b&gt;My Name&lt;/b&gt;&lt;/div&gt;</code> </p>
  
  <p>but I see <code>&lt;div&gt;{{ template_string }}&lt;/div&gt;</code></p>
  
  <p>I need something like <code>{{ template_string | eval }}</code> or something else to evaluate the content of the variable on current context.</p>
  
  <p>It's possible? I need something to use this approach because <code>template_string</code> can be changed when the component is used. </p>
  
  <blockquote>
    <p>Edit1: </p>
  </blockquote>
  
  <p>Angular Version: 4.0.3</p>
  
  <p>E.g.</p>
  
  <pre><code>@Component({
    selector: 'product-item',
    template: `
      &lt;div class="product"&gt;{{ template }}&lt;/div&gt;`,
  })
  export class ProductItemComponent {
    @Input() name: string;
    @Input() price: number = 0;
    @Input() template: string = `{{ name }} &lt;b&gt;{{ price | currency }}&lt;/b&gt;`;
  }
  </code></pre>
  
  <p>Usage:</p>
  
  <pre><code>&lt;product-item [name]="product.name" [price]="product.price"&gt;&lt;/product-item&gt;
  </code></pre>
  
  <p><strong>Expected:</strong>    Product Name <strong>USD3.00</strong></p>
  
  <p><strong>Output:</strong>     <code>{{ name }} &lt;b&gt;{{ price | currency }}&lt;/b&gt;</code></p>