如何在AngularJS类中添加$watch来进行表单验证

Question

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

//testCtrl.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>
...

//testCtrl.js

...
class TestController {
constructor($scope,
...
) {
...
}
...

canSaveTest() {
return this.testForm.$valid;
}
...

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

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

但是我不确定我需要在代码的哪个部分添加这个监视器。

Answer 1

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

//testCtrl.html…

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

//testCtrl.js

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