如何用一些已編譯的HTML替換元素的值

如果我使用Angular編譯一些HTML，如何用編譯的HTML替換DOM元素的內容？例如：如何用一些已編譯的HTML替換元素的值

var html = "<div>{{msg}}</div>"; 
var scope = $scope.$new(); 
var scope.msg = "Hello World!"; 
var linkFn = $compile(html); 
var contents = linkFn(scope); 

element.replaceContents(contents);//what is the actual syntax for this?

來源

2016-05-02 David Grinberg

您想從元素中移除內容並追加新編譯的內容。

element.empty().append(contents)

來源

2016-05-02 22:38:30 ArcSine

感謝。不幸的是，看起來我所擁有的元素是D3元素，而不是Angular元素。 D3元素似乎沒有'empty（）'函數。你知道這種情況下的替代方案嗎？ –

如果您在指令中，則應該有權訪問原始HTML元素。如果我沒有記錯，D3會提供原始HTML元素，你試過'$（element）.empty（）。append（contents）'。 – ArcSine

這也沒有工作。其實我錯了，我發現該元素實際上在代碼中定義爲'element = document.createElement（'i'）;'，所以我猜它是一個原始DOM元素。任何線索我需要在這種情況下做什麼？ –

純JavaScript的方式是element.innerHTML = contents;

來源

2016-05-02 22:40:04

這樣做會刪除角度綁定，因爲innerHTML會將DOM片段轉換爲字符串（刪除綁定）。保持DOM片段（這是'$ compile'產生的東西）完好無損，保留所有綁定。 – ArcSine

謝謝，我學到了一些新東西。將刪除我的答案。 –

如何用一些已編譯的HTML替換元素的值

回答

相關問題