title: How to check for state change in angular 4/6?
body: <p>My task is to create an account information web page which consists of 4 pre-filled fields (given name, family name, username and email) and a common save button at the bottom. User can change any field by the respective field. I want save button to be enabled only if user changes any fields. Any method to track state changes? My code is as follows:</p>
  
  <pre><code> &lt;mat-card-content&gt;
      &lt;div class="form-group"&gt;
        &lt;mat-form-field class="simple-form-field-50"&gt;
          &lt;input matInput placeholder="Given name" name="givenName" formControlName="givenName"&gt;
        &lt;/mat-form-field&gt;
        &lt;mat-form-field class="simple-form-field-50"&gt;
          &lt;input matInput placeholder="Family name" name="familyName" formControlName="familyName"&gt;
        &lt;/mat-form-field&gt;
        &lt;br&gt;
        &lt;mat-form-field&gt;
          &lt;input matInput placeholder="Email" name="email" formControlName="email"&gt;
        &lt;/mat-form-field&gt;
        &lt;br&gt;
        &lt;button
            [disabled]="waiting"
            class="simple-form-button" 
            color="primary" 
            mat-raised-button 
            type="submit" 
            value="submit"&gt;
          Save
        &lt;/button&gt; 
      &lt;/div&gt;
  &lt;/mat-card-content&gt;
  </code></pre>
  
  <p>My Code Output:
  <img src="https://imgur.com/wPt9RF2.png" alt="Code Output"></p>