title: $watch vs. ngChange
body: <p>Say that you want to do something when a property of <code>$scope</code> changes. And say that this property is bound to an <code>input</code> field. What are the advantages/disadvantages of using <code>$watch</code> vs. using <code>ngChange</code>?</p>
  
  <p><strong>html</strong></p>
  
  <pre><code>&lt;input ng-model="foo" ng-change="increment()"&gt;
  &lt;p&gt;foo: {{foo}}&lt;/p&gt;
  
  &lt;!-- I want to do something when foo changes.
       In this case keep track of the number of changes. --&gt;
  &lt;p&gt;fooChangeCount: {{fooChangeCount}}&lt;/p&gt;
  </code></pre>
  
  <p><strong>js</strong></p>
  
  <pre><code>// Option 1: $watch
  $scope.$watch('foo', function() {
    $scope.fooChangeCount++;
  });
  
  // Option 2: ngChange
  $scope.fooChangeCount = 0;
  $scope.increment = function() {
    $scope.fooChangeCount++;
  };
  </code></pre>
  
  <p><a href="http://plnkr.co/edit/4xJWpU6AN9HIp0OSZjgm?p=preview">http://plnkr.co/edit/4xJWpU6AN9HIp0OSZjgm?p=preview</a></p>
  
  <p>I understand that there are times when you need to use <code>$watch</code> (if the value you're looking to watch isn't bound to an input field). And I understand that there are times when you need to use <code>ngChange</code> (when you want to do something in response to a change in an input, but not necessarily in response to a scope property change).</p>
  
  <p>However, in this case both accomplish the same thing.</p>
  
  <p>My thoughts:</p>
  
  <ul>
  <li><code>ngChange</code> seems cleaner, and easier to understand what's happening.</li>
  <li><code>$watch</code> seems like it might be slightly faster, but probably negligible. With <code>ngChange</code>, I think Angular would have to do some extra work in the compile phase to set up the event listeners, and perhaps extra event listeners decrease speed a bit. Regardless of whether or not you use <code>ngChange</code>, the digest cycle runs on changes, so you have an opportunity to listen for something and call a function in response to changes. </li>
  </ul>