Incorporating two-way databinding with changes made on a form

I have three buttons: Edit Data, Save and Cancel.
At the outset Cancel and Save and disabled, edit data is enabled.

I have a couple of boolean variables in the typescript file;
Using two-way data binding, I can control when the disabled properties are re-enabled.

Is there a way of incorporating form.pristine and or form.valid with the two way data binding so that only when the corresponding value is set and the form has been modified that the Save and
cancel buttons become pressable?



I think you have to subscribe to the valueChanges Observable in order to do anything more creative. You might also look at using the reactive forms style instead of two-way data binding with template-driven forms.


Reactive Forms style is not acceptable with my current employer, most of the application under development is Template-Driven Forms.
Many thanks for the suggestion with regards to valueChanges Observable though.