'Is this bad practice for AngularJS

I wish to place:

{{$ctrl.agrmtDetails.form.$invalid == true? $ctrl.checkValidation() : $ctrl.checkValidation()}} 

I currently have:

<p style="display:none" >{{$ctrl.agrmtDetails.form.$invalid == true?$ctrl.formData.agrmtDetails.validated = false : $ctrl.formData.agrmtDetails.validated = true}}</p>

Both lines will be on the HTML page.

I just need something to appear if a condition is met.

Are both okay? I just thought having a p-tag and hiding it seems silly.

Thanks.



Solution 1:[1]

Yes, I would consider both of those to be bad practice. It sounds like you are really looking for a scope watcher: https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$watch

Here is an example of what you could put into your controller:

$scope.$watch(function() {
    return this.agrmtDetails.form.$invalid == true; // Value that is being "watched"
}, function(newValue) {
    this.formData.agrmtDetails.validated = !newValue;
    // Or whatever "checkValidation()" was intended to be.
});

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 user752