fix(datepicker): respond to external error state changes

Fixes the datepicker not responding, if something external changes the error state. For example, if the element has `ng-required` that depends on another input's value.

Fixes #8878.

Closes #9048

Author: crisbeto

src/components/datepicker/js/datepickerDirective.js

@@ -363,6 +363,9 @@
       self.resizeInputElement();
       self.updateErrorState();
     };
+
+    // Responds to external error state changes (e.g. ng-required based on another input).
+    ngModelCtrl.$viewChangeListeners.unshift(angular.bind(this, this.updateErrorState));
   };
 
   /**

src/components/datepicker/js/datepickerDirective.spec.js

@@ -321,6 +321,17 @@ describe('md-datepicker', function() {
       expect(controller.inputContainer).toHaveClass('md-datepicker-invalid');
     });
 
+    it('should toggle the invalid class when an external value causes the error state to change', function() {
+      pageScope.isRequired = true;
+      populateInputElement('');
+      expect(controller.inputContainer).toHaveClass('md-datepicker-invalid');
+
+      pageScope.$apply(function() {
+        pageScope.isRequired = false;
+      });
+      expect(controller.inputContainer).not.toHaveClass('md-datepicker-invalid');
+    });
+
     it('should not update the model when value is not enabled', function() {
       pageScope.dateFilter = function(date) {
         return date.getDay() === 1;