Home/ Questions/Q 8363591
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-09T12:12:56+00:00

I wondering if it is possible at runtime to break the link between the

  • 0

I wondering if it is possible at runtime to break the link between the model and the view.
In the following example, all the are link together (through the text model). When I click the button I want to make angular to not update the last input any more (for example to start some jquery effects…).

<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>

My real case is here: http://jsfiddle.net/5JZPH/10/
In the jsfiddle example I expect that the old values (these that are fading) do not change any more when I press the ‘+’ button.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You can fadeOut jQuery-cloned html element: 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;
                    });
                });
            }
        }
    };
})
    • 0