zoukankan      html  css  js  c++  java
  • [AngularJS] ng-change vs $scope.$watch

                <div class="form-group">
                    <label for="pwd">Password</label>
                    <input id="pwd"
                           type="password"
                           class="form-control"
                           placeholder="Password"
                           ng-change="onChange()"
                           ng-model="user.password">
    
    ---------------------------------
        //ngChange
        $scope.onChange=function(){
            var newVal = $scope.user.password;
            if (!newVal) return;
            $scope.reqs = [];
    
            if (!isLongEnough(newVal)) {
                $scope.reqs.push('Too short');
            }
    
            if (!hasNumbers(newVal)) {
                $scope.reqs.push('Must include numbers');
            }
    
            $scope.showReqs = $scope.reqs.length;
        }

    For a form, when user type on the input field, both ngChange and $watch will get fired.

    The difference between ngChange and $watch is :

    ngChange:

    If I click "Please Hack Me," you can see the value change but we don't get our warnings back.

                <button class="btn btn-danger"
                        ng-click="user.password = 'pwd'">Please Hack Me</button>

    The reason for that is ng-change only reacts to changes in the actual form element that you have declared it on. If your value changes programmatically as the result of anything but actually interacting with the element ng-change is not going to fire.

    $watch:

    $watch is not recommended by Angular team, because it is expensive. In most cases, when monitor the form elements, we can use ngChange instead of $watch.

    But for the case value changes programmatically, you have to use $watch.

  • 相关阅读:
    6个Windows Live™ Messenger beta的邀请
    终于可以抛弃Adobe Acrobat了
    如何在VxWorks下为TAU G2的程序设置断点
    基于C++的模板引擎
    思维导图确实是个好东西
    换了一个免费的PDF生成工具
    V.42 bis的源程序
    统计源程序的工具
    Doxygen的输出中文乱码
    如何编写Google CTemplate的Modifier
  • 原文地址:https://www.cnblogs.com/Answer1215/p/4095610.html
Copyright © 2011-2022 走看看