Angular(2 +) Detect if data in an Angular form (reactive) was changed [duplicate]

Answer 1

When you are working with reactive forms (https://angular.io/guide/reactive-forms), there is a property pristine and a property dirty on the form-group and the control. Should look similar to this:

  

    
    ... (further inputs)

     Save 
  

and the .ts file:

import { Component, .... } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';

@Component({...})
export class YourFancyComponent {
  myGroup: FormGroup;
  constructor(private( formBuilder: FormBuilder) {
      this.myGroup = this.formBuilder.group({
        'ctrl1': 'defValue',
        'ctrl2': 'defaultValue2'
      });
  }
}

For template-driven forms (according to https://angular.io/guide/forms#track-control-state-and-validity-with-ngmodel) the css class of the modified input control changes from ng-pristine to ng-dirty but that doesn't help with the save button.