title: Getting value from ngModel in directive when using object with property
body: <p>Not sure how to phrase the question so please edit if you can come up with something better. I have the following directive:</p>
  
  <pre><code>app.directive('foo', function() {
      return {        
          restrict: 'A',
          require: "?ngModel",
          link: function (scope, element, attrs, controller) {
              scope.$watch(attrs.ngModel, function () {
                  console.log("Changed to " + scope[attrs.ngModel]);
              });
          }
      };
  });
  </code></pre>
  
  <p>When I have this it works great and logs properly</p>
  
  <pre><code>&lt;input type="text" ng-model="bar" /&gt;
  
  app.controller('fooController', function($scope) { 
      $scope.bar = 'ice cream';
  });
  </code></pre>
  
  <p>It doesn't work when I try it this way around. It keeps logging 'Changed to undefined'</p>
  
  <pre><code>&lt;input type="text" ng-model="model.bar" /&gt;
  
  app.controller('fooController', function($scope) { 
      $scope.model = { bar: 'ice cream' };
  });
  </code></pre>
  
  <p>How do I make it work for both scenarios. It seems the right thing to do seeing as angular lets you use both.</p>