角度材质md-select空值验证不起作用

Question

在md-select中，我添加了一个空的md选项项目，并且此选择字段是必填字段。但是当我选择'选择一个'项目时，验证不起作用，其值为空。

Codepen：http://codepen.io/anon/pen/ygrJLG

<div ng-controller="AppCtrl" ng-cloak="" layout="column" layout-align="center center" layout-padding="" class="selectdemoValidations" ng-app="MyApp"> 
    <form name="myForm"> 

    <div layout="row" layout-align="start" flex=""> 
     <md-input-container flex> 
     <label>Favorite Color</label> 
     <md-select name="favoriteColor" ng-model="favoriteColor" required="" > 
      <md-option value=''>Choose One</md-option> 
      <md-option ng-value=color ng-repeat="color in colors">{{color}}</md-option>   
     </md-select> 
     <div class="errors" ng-messages="myForm.favoriteColor.$error"> 
      <div ng-message="required">Required</div> 
     </div> 
     </md-input-container> 
    </div> 

    <div layout="row" layout-align="start"> 
     <md-checkbox ng-model="myForm.$invalid" disabled="">Form Invalid</md-checkbox> 
     <md-checkbox ng-model="myForm.$dirty" disabled="">Form Dirty</md-checkbox> 
     <md-checkbox ng-model="myForm.$submitted" disabled="">Form Submitted</md-checkbox> 
     <md-checkbox ng-model="myForm.favoriteColor.$touched" disabled="">Select Touched</md-checkbox> 
    </div> 

    <div layout="row" layout-align="end" flex=""> 
     Selected Color is {{favoriteColor}} 
     <md-button ng-click="clearValue()" ng-disabled="!favoriteColor">Clear</md-button> 
     <md-button ng-click="save()" class="md-primary">Save</md-button> 
    </div> 
    </form> 
</div> 

Answer 1

可以与修复：

$scope.$watch('favoriteColor', function(val) 
{ 
    if (!val) $scope.favoriteColor = null; 
}); 

为什么？因为有null和undefined之间的差异：

空=的值设置为空值

未定义=值尚未初始化

Answer 2

只是把“选一”选项可以禁用：

<md-option ng-value disabled>Choose One</md-option>