如何從Angular 2中的數據渲染靜態Angular組件？

Question

正如所料，在Angular 2中，我可以創建組件，如果我在模板中使用它們，它們將呈現。在此代碼，「文本」是另一個部件的選擇和它的作品如預期，如果我通過一些字符串轉換成[值]：

@Component({ 
     selector: 'my-app', 
     template: ` 
     <div class="main"> 
      <text [value]="testModel.data.value"></text> 
     </div> 
     ` 
    }) 
export class AppComponent { 
    name = 'Angular Example'; 
    testModel = { 
    data: { 
     value: `Regular string text works fine.` 
    } 
    } 
} 

但我需要的是字符串的HTML數據傳遞到一個組件而且數據還可以包含角度成分，更多的東西是這樣的：

@Component({ 
      selector: 'my-app', 
      template: ` 
      <div class="main"> 
       <text [value]="testModel.data.value"></text> 
      </div> 
      ` 
     }) 
    export class AppComponent { 
     name = 'Angular Example'; 
     testModel = { 
     data: { 
      value: `<b>Some</b> 
       text value to 
       <inner-component> 
        this component gets ignored when text is rendered 
       </inner-component> 
       render 
       ` 
     } 
     } 
    } 

我看到其他的答案中動態生成組件，但我不需要的是，我已經只是靜態的預先定義的組件創建可能存在於我的數據字符串中。

這裏是文本組件：

import { Component, Input, ViewChild } from '@angular/core'; 

@Component({ 
    selector: 'text', 
     template: ` 
     <div > 
      <div [innerHtml]="value">loading...</div> 
     </div> 
     ` 
    }) 
    export class TextComponent { 
     @Input() value: string; 
    } 

理想我傳遞字符串會任何HTML渲染以及呈現的任何角度。以下是我的意思是在角1：https://plnkr.co/edit/FacA3AwOqJA2QARK28c8?p=preview

編輯：不是重複

我沒有看到這個普拉克是如何回答：http://plnkr.co/edit/wh4VJG?p=preview

Answer 1

「我看到其他的答案爲動態生成組件，但我不需要，只是我已經創建的靜態預定義組件，可能存在於我的數據字符串中。「

即使只是靜態預定義組件，Angular需要編譯它，否則它將被視爲正常的html標記。

在HTML

<inner-component> 
       this component gets ignored when text is rendered    
    </inner-component> 

的innerHTML的指令剛剛替換所提供的HTML元素的內部HTML，但它不會再編譯，所以誰的要採取編譯你inner-的護理組件？

因此，您需要找到一種方法來動態編譯該html片段。

你應該找到自己的方式在

How can I use/create dynamic template to compile dynamic Component with Angular 2.0?

Equivalent of $compile in Angular 2

和工作的例子是http://plnkr.co/edit/wh4VJG?p=preview