AngularJs 在 ng-repeat 选择名称中选择 $index 无法识别答案

【问题标题】：AngularJs Select within a ng-repeat select Name with $index not recognizedAngularJs 在 ng-repeat 选择名称中选择 $index 无法识别
【发布时间】：2024-04-28 06:15:02
【问题描述】：

我在 ng-repeat 中有一个 select 语句。我使用 $index 值来获取每个选择的唯一名称。然后我使用这个名称来检查验证。验证在不在重复范围内时运行良好，但在重复范围内时，所需选择周围的红色框不会显示。

这是小提琴。

非常感谢任何帮助。

P.S 单击 + 号以在小提琴中添加更多行。

http://jsfiddle.net/angularNovice/T47CG/6/

<form name="testForm">
   <select name="selectOutside"      
      class="span2" ng-model="plugin.selectedDevice" 
      ng-options="item.ID as item.Title for item in devices" ng-required="true">
      <option style="display:none" value=""></option>
   </select>
   <span class="error" ng-show="testForm.selectOutside.$error.required">
      *
   </span><br>
   <a class="btn" ng-click="addPlugin()">
   <i class="glyphicon glyphicon-plus"></i></a>

   <table>
      <tr ng-repeat="plugin in plugins">
         <td><strong>{{$index}}</strong>
         </td>
         <td>
            <select name="selectInside{{$index}}" class="span2"     
                ng-model="plugin.selectedDevice" 
                ng-options="item.ID as item.Title for item in devices" ng-required="true">
                <option style="display:none" value=""></option>
            </select>
            <span class="error"
                ng-show="testForm.selectInside{{$index}}.$error.required">
                 *
            </span>
         </td>
     </tr>
  </table>
</form>

【问题讨论】：

你可以试试testForm['selectInside' + $index].$error.required这个表达式
不，那没用。
点击提交按钮可以看到验证错误。见 jsFiddle jsfiddle.net/T47CG/12

标签： angularjs select indexing required ng-repeat

【解决方案1】：

问题是您在ng-repeat 中生成的名称属性不会在表单控制器变量上生成正确的属性。在你的情况下是

{"selectOutside":{},"selectInside{{$index}}":{}}

您的选择是在每次重复时声明一个子表单，然后使用相同的变量名称并检查错误。

详情见此帖http://www.benlesh.com/2013/03/angular-js-validating-form-elements-in.html

【讨论】：