title: Angular 4: How to watch an object for changes?
body: <p><strong>ETA: I know that there are various ways to watch my <em>form</em> for changes. That is not what I am trying to do. As the title says, I am asking how to watch for changes to an <em>object</em>. The app shown below is for illustration purposes only. Please answer the question that I have asked. Thanks!</strong></p>
  
  <p>I have this simple app:</p>
  
  <pre><code>import { Component, OnInit } from '@angular/core';
  
  export class Customer {
      firstName: string;
      favoriteColor: string;
  }
  
  @Component({
      selector: 'my-app',
      template: `
          &lt;div *ngIf="customer"&gt;
              &lt;input type="text" [(ngModel)]="customer.firstName"&gt;
              &lt;input type="text" [(ngModel)]="customer.favoriteColor"&gt;
          &lt;/div&gt;
          `
  })
  export class AppComponent implements OnInit {
  
      private customer: Customer;
  
      ngOnInit(): void {
  
          this.customer = new Customer();
  
          // TODO: how can I register a callback that will run whenever
          // any property of this.customer has been changed?
  
      }
  
  }
  </code></pre>
  
  <p>Note the TODO. I need to register a callback that will run whenever any property of  <code>this.customer</code> has been changed.</p>
  
  <p><strong>I cannot use ngChange on the inputs. I need to subscribe directly to changes on the model.</strong> The reasons pertain to my use case, and aren't worth going into here. Just trust me that this isn't an option.</p>
  
  <p>Is this possible? I've done a lot of Googling, but I've come up dry.</p>