我的 ng-repeat 中有一些控件。其中之一是如下所示的下拉菜单。单击按钮时,我正在验证必填字段,并希望突出显示有错误的表格单元格。 对于下拉菜单,我无法突出显示表格单元格或控件。代码如下。
<tr ng-repeat="data in myData">
<td>
<select class="form-control" ng-required="true" ng-options="env for env in types" ng-model="data.type">
<option value="">Select</option>
</select>
</td>
</tr>
但是对于文本框,我可以执行以下操作并且它会突出显示:
<td ng-class="{ 'has-error': myForm['input_' + {{$index}}].$invalid && (myForm['input_' + {{$index}}].$touched || myForm.$submitted) }">
<input type="text" name="input_{{$index}}" required ng-model="data.input" class="form-control" />
</td>
上面的代码适用于文本框,我可以看到红色突出显示,但如果我使用与 TD 相同的代码,它就不起作用。
请输入任何信息。
最佳答案
您的 select
标记需要一个名称。 AngularJS 中的验证状态要求表单元素有一个名称:
<td ng-class="{ 'has-error': myForm['input_select_' + {{$index}}].$invalid && (myForm['input_select_' + {{$index}}].$touched || myForm.$submitted) }">
<select class="form-control"
name="input_select_{{$index}}"
ng-required="true"
ng-options="env for env in types"
ng-model="data.type">
<option value="">Select</option>
</select>
</td>
关于javascript - AngularJS 使用包含下拉列表的 ng-repeat 突出显示表格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56081600/