如何在 AngularJS 类中添加用于表单验证的$watch

How to add $watch for form validation inside AngularJS class

提问人:Milena 提问时间:9/21/2021 更新时间:9/22/2021 访问量:28

问:

我尝试添加一个$watch来检查表单是否有效。

测试Ctrl.html

 ....
             <div class="row" ng-form="testCtrl.testForm">
                            ...
                      <div class="form-group">
                        <label>NAME</label>
                        <input
                            class="form-control"
                            id="name"
                            type="text"
                            ng-model="testCtrl.testEdit.displayName"
                            autofocus
                            required />
                      </div>
    ...

测试Ctrl.js

 ...
    class TestController {
        constructor($scope,
                    ...
                    ) {
    ...
        }
    ...
    
    canSaveTest() {
        return this.testForm.$valid;
    }

...

我想通过这种方式添加一个观察者:

$scope.$watch('testForm.$invalid', function(isInvalid)          {
        $scope.disableNextBtn = isInvalid;
});

但我不确定我需要在代码的哪一部分添加这个观察器。

JavaScript AngularJS 表单 验证 angularjs-scope

评论


答:

0赞 Milena 9/22/2021 #1

我刚刚为 ng-change 添加了 validateData:

测试Ctrl.html ...

                   <input
                        class="form-control"
                        id="name"
                        type="text"
                        ng-model="testtCtrl.testEdit.displayName"
                        ng-change="testCtrl.validateData()"
                        autofocus
                        required
                    />

测试Ctrl.js

validateData() {
            this.disableNextBtn = !this.testForm.$valid;
    }