Javascript 在AngularJS中验证下拉菜单

我有以下代码，仅当控件从给定的

select

元素移开时才进行验证，即

select

元素的边框只有在给定的

select

选项卡移开或鼠标光标从给定的

select

元素移开时才显示为红色或绿色

<select class="form-control input-xsmall select-inline" ng-class="{'invalid': form.year.$dirty && currentYear=='Year', 'valid': form.year.$dirty && currentYear != 'Year'}" data-ng-model="currentYear" name="year">
    <option>Year</option>
    <option ng-repeat="year in years" value="{{year}}">{{year}}</option>
</select>

年
{{year}

当用户实际设置

选项

元素的值，但使选择元素

$dirty

或

变脏时，如何根据选择框的有效性向用户显示绿色或红色边框$原始的

有人能帮我吗？

您可以使用

ng blur

将自己的“toucted”属性添加到

年份中，然后使用该“toucted”属性添加正确的类

<select class="form-control input-xsmall select-inline" 
  ng-class="{'invalid': form.year.isTouched && currentYear=='Year', 'valid': form.year.isTouched && currentYear != 'Year'}" 
  ng-blur="form.year.isTouched = true"
  data-ng-model="currentYear" 
  name="year">
    <option>Year</option>
    <option ng-repeat="year in years" value="{{year}}">{{year}}</option>
</select>


年
{{year}

请参见此示例plunker:
您使用的是AngularJs 1.3.x还是1.2.x？@JoseM:AngularJs 1.2.21在1.3中有一个
$touch
属性可以使用，但默认情况下在1.2中没有类似的属性，尽管您可以制定自己的指令