Question

我想知道在运行时是否有可能破坏模型和视图之间的联系在以下示例中，所有链接在一起（通过 text 模型）。当我单击按钮时，我想使角度不再更新最后一个输入（例如，启动一些jquery效果......）。

<html ng-app>
  <head>
    <script src="angular-1.0.1.js"></script>
  </head>
  <body>
    <input ng-model="text"/><br/>
    <input ng-model="text"/><br/>
    <input ng-model="text"/><input type="button" value="<- break!" ng-click="???"/><br/>
  </body>
</html>

我的真实案例在这里：http://jsfiddle.net/5JZPH/10/
在jsfiddle示例中，我希望当我按下“+”按钮时，旧值（这些正在衰落）不会再改变。

Answer 1

你可以fadeOut jQuery-cloned html元素：http://jsfiddle.net/5JZPH/29/

HTML：

<div ng-app="test">
    <input type="button" value=" + " ng-click="index = index + 1"/>
    <input ng-model="index" smooth="index" style="display:block"/>
    [{{index}}]
</div>

JavaScript的：

angular.module('test', [])
.directive('smooth', function() {
    return {
        transclude: 'element',
        priority: 750,
        terminal: true,
        compile: function(element, attr, linker) {
            return function(scope, iterStartElement, attr) {

                var prevClone = null;

                scope.$watch(attr.smooth, function() {

                    var newScope = scope;

                    linker(newScope, function(clone) {

                        if ( prevClone ) {

                            newPrevClone = prevClone.clone();
                            prevClone.after(newPrevClone);
                            prevClone.remove();
                            newPrevClone.fadeOut(2000, function() { $(this).remove() });
                        }

                        iterStartElement.after(clone);

                        prevClone = clone;
                    });
                });
            }
        }
    };
})

angularJS：如何打破模型和视图之间的联系

1 个答案: