fix(select): ngModel validator should use option hashkeys.

* Currently when using `required` on the select, is adding the required validator to the ngModelCtrl.
  The required validator is checking the `$viewValue`by using the `$isEmpty` function, which is overwritten
  by the select component.

  `$isEmpty` normally checks just for truthy values, but our custom `$isEmpty` function checks the value for being a registered option.
  This does not work, because we are just trying to find the value in the options object.
  Once the the value is also an object, we are not able to find the option (which is wrong). All options inside of the variable are stored within their
  associated hashkey.

  That's why we have to retrieve the hashkey of the current value. This is also required for ngModel's with a `trackBy` option.

* Once an option is set to the ngModel, before the actual `md-option` directive is registered, the required validator will be set to `false`.
  We have to trigger a new validation, when the option, which is currently the $modelValue, has been registered.

Fixes #8666.

Closes #8763

Author: devversion

src/components/select/select.js

@@ -685,7 +685,9 @@ function SelectMenuDirective($parse, $mdUtil, $mdTheming) {
 
       // Setup a more robust version of isEmpty to ensure value is a valid option
       self.ngModel.$isEmpty = function($viewValue) {
-        return !self.options[$viewValue];
+        // We have to transform the viewValue into the hashKey, because otherwise the
+        // OptionCtrl may not exist. Developers may have specified a trackBy function.
+        return !self.options[self.hashGetter($viewValue)];
       };
 
       // Allow users to provide `ng-model="foo" ng-model-options="{trackBy: 'foo.id'}"` so
@@ -763,11 +765,21 @@ function SelectMenuDirective($parse, $mdUtil, $mdTheming) {
         throw new Error('Duplicate md-option values are not allowed in a select. ' +
           'Duplicate value "' + optionCtrl.value + '" found.');
       }
+
       self.options[hashKey] = optionCtrl;
 
       // If this option's value was already in our ngModel, go ahead and select it.
       if (angular.isDefined(self.selected[hashKey])) {
         self.select(hashKey, optionCtrl.value);
+
+        // When the current $modelValue of the ngModel Controller is using the same hash as
+        // the current option, which will be added, then we can be sure, that the validation
+        // of the option has occurred before the option was added properly.
+        // This means, that we have to manually trigger a new validation of the current option.
+        if (self.ngModel.$modelValue && self.hashGetter(self.ngModel.$modelValue) === hashKey) {
+          self.ngModel.$validate();
+        }
+
         self.refreshViewValue();
       }
     };

src/components/select/select.spec.js

@@ -883,6 +883,36 @@ describe('<md-select>', function() {
         expect($rootScope.testForm.$valid).toBe(true);
       }));
 
+      it('properly validates required attribute with object options', inject(function($rootScope, $compile) {
+        var template =
+          '<form name="testForm">' +
+          '  <md-select ng-model="model" ng-model-options="{ trackBy: \'$value.id\' }" required="required">' +
+          '    <md-option ng-repeat="opt in opts" ng-value="opt"></md-option>' +
+          '  </md-select>' +
+          '</form>';
+
+        $rootScope.opts = [
+          { id: 1, value: 'First'  },
+          { id: 2, value: 'Second' },
+          { id: 3, value: 'Third'  },
+          { id: 4, value: 'Fourth' }
+        ];
+
+        $compile(template)($rootScope);
+
+        // There is no value selected yet, so the validation should currently fail.
+        $rootScope.$digest();
+
+        expect($rootScope.testForm.$valid).toBe(false);
+
+        // Select any valid option, to confirm that the ngModel properly detects the
+        // tracked option.
+        $rootScope.model = $rootScope.opts[0];
+        $rootScope.$digest();
+
+        expect($rootScope.testForm.$valid).toBe(true);
+      }));
+
       it('should keep the form pristine when model is predefined', inject(function($rootScope, $timeout, $compile) {
         $rootScope.model = [1, 2];
         $rootScope.opts = [1, 2, 3, 4];