8

我想知道是否有可能在运行时断开模型和视图之间的链接。
在以下示例中,所有内容都链接在一起(通过文本模型)。当我单击按钮时,我想让 Angular 不再更新最后一个输入(例如启动一些 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 示例中,我希望当我按下“+”按钮时,旧值(这些正在消失的值)不再改变。

4

1 回答 1

4

您可以淡出 jQuery 克隆的 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;
                    });
                });
            }
        }
    };
})
于 2012-08-09T18:18:14.967 回答