真正停止元素绑定 - 取消元素绑定 - AngularJS

我正在尝试找出如何阻止DOM来自角度范围内的绑定数据的元素。

我知道您可以使用 if 语句等来做到这一点，但是有没有一种真正且永久的方法来停止绑定角度元素但保留添加的内容？

所以说我有这个

<div ng-bind=​"content" class=​"ng-binding">​Welcome​</div>​

我更改了模型，以便 div 更改为这个。

<div ng-bind=​"content" class=​"ng-binding">​Welcome​ World</div>​

然后我单击将解除绑定的按钮，因此如果我将模型更改为'Welcome Universe'， 我想要<div>和以前一样。这

<div ng-bind=​"content" class=​"ng-binding">​Welcome​ World</div>​

我知道还有很多其他方法可以做到这一点，但我不知道有什么方法可以真正解除元素的绑定，而不克隆它并替换循环属性和文本的旧元素..ect

演示的东西：http://jsfiddle.net/a9tZY/ http://jsfiddle.net/a9tZY/

因此，通过这样做，它不应该影响模型或绑定到该模型的其他元素。

长话短说，告诉 Angular 永远不要管这个元素。

UPDATE

执行此操作的方法是使用类似这样的指令在元素上创建一个新范围。

yourModule.directive('unbindable', function(){
    return { scope: true };
});

并将其应用到您的元素上，如下所示

<div unbindable id="yourId"></div>

然后，要取消此元素与任何更新的绑定，请执行以下操作。

angular.element( document.getElementById('yourId') ).scope().$destroy();

完成了，这是一个演示。

Demo: http://jsfiddle.net/KQD6H/ http://jsfiddle.net/KQD6H/

因此，这会在元素上创建一个新作用域，并且只有在所有作用域都继承其父作用域的所有数据时才有效。因此该作用域与父作用域基本相同，但允许您在不影响父作用域的情况下销毁该作用域。因为这个元素被赋予了它自己的作用域，所以当你销毁它时，它不会像所有其他元素一样取回父作用域，如果这有意义的话 0.o

此行以下的所有内容都是我最初的答案，我将其留在这里，以防有人喜欢这种方式

我已经成功地实现了这一目标unbindable指示。 当你拥有unbinable在元素上设置的指令解除元素绑定所需的全部内容就是这个。

yourElement.attr('unbind', 'true'); // Ref 1
$scope.$broadcast('unbind'); // Ref 2

这是指令。

app.directive('unbindable', function(){
    return {
        scope: true, // This is what lets us do the magic.
        controller: function( $scope, $element){ 
            $scope.$on('unbind', function(){ // Ref 3
                if($element.attr('unbind') === 'true'){ // Ref 4
                    window.setTimeout(function(){ $scope.$destroy() }, 0);//Ref 5
                }
            });
        }
    }
});

然后你像这样设置你的元素。

<h1 unbindable></h1>

所以每当你添加unbind="true"归因于h1并广播unbind该元素将被解除绑定

REF-1:将 unbind true 属性添加到元素，以便指令知道您要取消绑定哪个元素。

REF-2:在整个范围内广播取消绑定事件，以便指令知道您想要取消绑定元素 - 确保首先添加该属性。 --- 根据您的应用程序布局，您可能需要使用$rootScope.$broadcast

REF-3：解除绑定事件广播时

REF-4：如果与指令关联的元素具有 true unbind 属性

REF-5：然后销毁该指令制定的作用域。我们必须使用setTimeout因为我认为 Angular 试图在之后做一些事情$on事件，我们得到一个错误，所以使用setTimeout将防止该错误。虽然瞬间就火了。

这适用于多个元素，这是一个很好的演示。

Demo: http://jsfiddle.net/wzAXu/2/ http://jsfiddle.net/wzAXu/2/