移動HTML內容並保留AngularJS雙向數據綁定

有些東西我沒有得到有關Angular的信息。我有一個AngularJS頁面，我必須在內容中移動，但有數據綁定。我這裏有一個小提琴，說明了我想做的事情，而問題：http://jsfiddle.net/gbisaga/cmzBL/6/移動HTML內容並保留AngularJS雙向數據綁定

<input type="text" size="50" ng-model="model.dentist" name="petDentist" />

如果你改變了「名」或「類型」字段，修改下面顯示的字符串值;但如果你改變狗牙醫領域，它不會。當我移動內容時，我希望這個元素繼續綁定到模型上;正如你在小提琴中看到的那樣，它不是。

我猜實際上發生的是該字段的值填充在my-append-children之前執行，綁定實際上從未發生。我也玩過編譯功能，而不是我的指令中的鏈接，但是效果不太好。有一件事我顯然沒有到達這裏。

來源

2014-01-11 fool4jesus

你需要在你的指令的最後補充一點：

$compile(target.contents())(scope);

更新小提琴：Fiddle

你需要編譯添加這樣的角度可以解釋它的標記。

來源

2014-01-11 17:07:58 Rob

好極了！感謝您的答覆。我想過$編譯，但是我讀過的文檔在你需要使用它的時候並不是很清楚。 – fool4jesus

將孩子移動到目標後，需要刪除該元素。如果你element.remove（）也將刪除所有元素的綁定和事件處理器及其子

.directive('myAppendChildren', function() { 
    return { 
     restrict: 'E', 
     link: function (scope, element, attrs) { 
      var target = $(attrs.target); 
      target.append(element.children()); 
      element.remove(); 
     } 
    }; 
})

來源

2014-01-12 19:38:26 Michael

移動HTML內容並保留AngularJS雙向數據綁定

回答

相關問題