How to add $watch for form validation inside AngularJS class

Question

I try to add a $watch to check if the form is valid or not.

// 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;
    }

...

I want to add a watcher in this way:

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

But I'm not sure in which part of the code I need to add this watcher.

Answer 1

I just added validateData for ng-change:

// 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;
    }