Javascript 如果删除并重新添加DOM元素，则ng单击绑定将丢失

在删除DOM树（）之后，我需要将以前编译的html重新添加回DOM树（）

内容绑定仍按预期工作。e、 当范围变量发生变化时，任何

{{someVariable}

绑定都会用新值更新

但是，

ng单击

绑定停止工作。控制器上的关联函数将停止调用

。最初单击+按钮，您将看到计数器增量。但是在两次单击“切换”之后，+按钮不再工作，但是{{count}}绑定仍然会更新

---

请忽略控制器内的DOM操作。这只是为了简化程序。您通常会在指令中执行此操作。有关更实际的实现，请参见和。

您必须首先使用所需的范围重新编译它

请看这里：

我首先编译模板，然后将其插入此行：

var targetFn = $compile(target);

---

您可以参考文档了解更多信息-

我很久没有使用jquery了，我忘记了一些问题

.detach（）方法与.remove（）方法相同，不同之处在于.detach（）保留与已删除元素关联的所有jQuery数据。当删除的元素稍后要重新插入DOM时，此方法非常有用

当然，angular的jqlite遵循相同的约定。因此对

replaceWith

的调用将删除由

ng click

附加的事件处理程序。相反，使用

detach

和

append

保留事件处理程序，所有操作都按预期进行：

使用detach（）

与replaceWith（）等效

---

)()

您可以参考以下解决方案：

HTML:

---

上面的代码给出了相应的输出。请检查这段代码，如果您想要获得输出，请将其标记为有用。

Wow，我不知道您可以像这样重新编译现有的DOM元素（我以为它只适用于html字符串和模板文件）。谢谢哈哈哈，当我发布我自己的答案时，你计时：）没有想到jQuery解决方案-直接进入角度：）

  old.before( new ).detach()

<div ng-controller="Ctrl">
    <button ng-click="toggle()">Toggle</button>
    <div ng-show="showContent" id="toggleTarget">
        Some content = {{myContent}}
        <button ng-click="inc()">+</button>
    </div>
    <div id="placeholder" ng-show="showplaceholder">Placeholder</div>
</div>

function Ctrl($rootScope, $scope, $element) {
    $scope.myContent = 1;

    var target = angular.element(document.getElementById("toggleTarget"));
    var placeholder = angular.element(document.getElementById("placeholder"));

    var removed = false;
    $scope.showContent = true;
    $scope.placeholder = false;

    $scope.toggle = function(){
        $scope.myContent += 1;

        if (removed) {
            $scope.showContent = true;
            $scope.placeholder = false;
            removed = false;
        }
        else {
            $scope.showContent = false;
            $scope.placeholder = true;
            removed = true;
        }    
    }

    $scope.inc = function(){
        $scope.myContent += 1;
    };
}

angular.module('app', []);