Angular 2動態HTML與屬性綁定

我有一個像字符串html='<span>{{name}}</span>'數據庫的HTML字符串，其中名稱是組件上的屬性。Angular 2動態HTML與屬性綁定

我想加載這個字符串在HTML中的名稱綁定。我發現了一些答案，如[innerHTML]，但不綁定在組件中聲明的屬性。

2016-12-07 Shashank Agarwal

在這裏你會得到相同的答案;-)您可以在運行時創建的組件（你鬆散AOT）喜歡解釋在http://stackoverflow.com/questions/34784778/equivalent-of-compile-in-angular-2/37044960#37044960 –

感謝您的快速答案，但我不想創建一個組件我只會收到一個字符串上按鈕點擊有什麼辦法嗎？ –

當然，創建一個組件，使用該字符串作爲模板，然後你去。您可以使用運行時提供的字符串來綁定Angular2。沒有組件就沒有辦法。 Angular2綁定僅適用於組件模板。 –

有想法去實現它，如果我們創建組件定製標註，並用它我們可以從API獲取元數據就像從JSP文件，並添加它，而不是到模板templateUrl

我還沒有創建示例代碼，但粗略的想法是在這裏 - >

export function CustomComponent(annotation: any) { 
     return function (target: Function) { 
// call your database and get your string here 
     var parentTarget = Object.getPrototypeOf(target.prototype).constructor; 

     var parentAnnotations = Reflect.getMetadata('annotations', parentTarget); 

     var parentAnnotation = parentAnnotations[0]; 
     Object.keys(parentAnnotation).forEach(key => { 
      if (isPresent(parentAnnotation[key])) { 
      if (!isPresent(annotation[key])) { 
       annotation[key] = parentAnnotation[key]; 
      } 
      } 
     }); 

     var metadata = new ComponentMetadata(annotation); 

     Reflect.defineMetadata('annotations', [ metadata ], target); 
     }; 
    };

，並使用它像

@CustomComponent({ 
    selector: 'sub' 
}) 
export class SubComponent { 
}

來源

2016-12-07 14:11:12 anshuVersatile

Angular 2動態HTML與屬性綁定

回答

相關問題