AngularJS指令 - 重新運行示波器參數更改的鏈接函數

Question

我有一個指令，它構建了一組代表文件夾結構的嵌套<ul>元素。我用的鏈接功能來創建新的DOM元素，並將它們添加到指令實例元素：<ul>樹內

function link(scope, iElement, iAttr) { 
    var rootElement = buildChildElement(scope.tree); 
    iElement.append(rootElement); 
} 

元素是有線與調用住房指令的控制器功能jQueryUI的的拖/放互動根據拖放事件來更新範圍參數。

我希望<ul>樹在scope參數發生變化時自動更新。我已經嘗試了手表的功能我的鏈接函數中：

scope.$watch('tree', function(newTree, oldTree) { 
    var newRoot = buildChildElement(newTree); 
    iElement.contents().remove(); 
    iElement.append(newRoot); 
} 

此作品在一定程度上，而是調用remove()火災關閉$watch()方法，它結束了恢復我的控制器改變第二次。如果我註釋掉remove()，我可以看到寫了一個新的<ul>樹，它正確地反映了對Controller中所做參數的更改。

雙重射擊$watch()讓我覺得我正在討論這個錯誤。沒有它，我的參數正在更新，但我的<ul>不會更新（被刪除的元素保留在它被刪除的地方）。

什麼是正確的方法來確保您的指令刷新其中一個範圍參數的更改？

我應該使用compile函數並根據屬性數組構建<ul>樹而不是使用link函數嗎？

Answer 1

你的方法非常的jQuery風格。我想你會發現你在這種情況下對付Angular。他/她的問題是正確的;你應該發佈一個演示或其他東西，或至少一些示例代碼，以便你可以有一個有效的答案。

我想你想做一個遞歸樹指令。 Check out this SO answer對此有一些有趣的方法。主要想法是手錶是不必要的。只需更改對象，Angular就會處理剩下的事情。最有效的方法是直接更改特定的節點對象，而不是替換整個對象，但這也能起作用。

Answer 2

scope.$watch('tree', function(newTree, oldTree) { 
    var newRoot = buildChildElement(newTree); 
    iElement.contents().remove(); 
    iElement.append(newRoot); 
},**true**) 

我覺得你可以試試，並引用表API的更多信息 這裏是另一個ARTICAL http://www.bennadel.com/blog/2566-scope-watch-vs-watchcollection-in-angularjs.htm