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.

  • 相关阅读:
    vue与后台交互之post用法
    django框架两个使用模板实例
    917,仅仅反转字母(简单)
    836,矩形重叠 (简单)
    860,柠檬水找零(简单)
    使用类创建对象后找不到的问题
    8_19 数据库
    8_16 MySQL数据库一
    Mysql的安装与配置
    文件操作中,使用递归退出不了。
  • 原文地址:https://www.cnblogs.com/Answer1215/p/4095610.html
Copyright © 2011-2022 走看看