I have a save button in the navbar of a modal. The save button should be in a disabled state unless the form within the modal is valid.
The code in the template is:
<button (click)="saveData()" [disabled]="!customForm.valid">
Save
</button>
When the modal is initiated I get the changed after it was checked console error. This, I believe, is because the form has not yet been instantiated when the validation is checked. My initial thought would be to move the whole ion-navbar to the end of the template, therefore ensuring the form has been instantiated. However, it seems that Ionic still processes the template with ion-navbar at the top, as I’m still getting the same error.
How can I check the validity of the form in the template above the form in question?
It seems I’m having the same issues as this SO question. The two possible solutions are to move the check below the form (which I cannot do in this case), or to implement something like:
[disabled]="customForm.valid === null ? true : !customForm.valid"
But still I get the same changed after it was checked error.