查找在 ng 重复中选择的 ng 选项

Question

我有一个 table，其中填充了指令 ngRepeat，每个项目中都有 ngOptions。在发生变化时，我在控制器中调用函数 transactionListFilter 来找出哪个 select 发生了变化，这样我就可以将所有其他 select 重置为默认值 'Multiple'.

查看

<tr data-ng-repeat="item in $ctrl.tableData">
    <td>
        <select 
         data-ng-options="item.appAndType for item in item.serviceUIs" 
         data-ng-model="selectedItem" 
         data-ng-change="$ctrl.transactionListFilter(selectedItem)" >
         <option value="">Multiple</option>
        </select>
    </td>                                    
</tr>

控制器

function transactionListFilter(data) {
    console.log(data)
    $scope.filter = data;
};

所以它应该是这样的：

但是如果我 select 第二个 select，第一个 select 仍然会填充一个申请号，而不是重置为 'Multiple'。当我提交 ngModel 值时，它会从 ngOptions.

提交数据

问题

如何识别来自控制器的 selected select，以便我可以将所有其他 select 值重置为 'Multiple'？

Answer 1

一种方法是选择 ng-repeat 迭代器的属性：

<tr data-ng-repeat="item in $ctrl.tableData">
    <td>
        <select data-ng-options="ui.appAndType for ui in item.serviceUIs" 
                data-ng-model="item.selectedUi" 
                data-ng-change="$ctrl.transactionListFilter(item,$index)" >
           <option value="">Multiple</option>
        </select>
    </td>                                    
</tr>

function transactionListFilter(item, index) {
    $ctrl.tableData.forEach( (_ , idx) => {
         if (index != idx) {
             _.selectedUi = null;
         };
    });  
    console.log(item.selectedUi, index)
};

Answer 2

我相信你可以在指令中使用 $index。我已经成功地在 ng-repeat with forms 中使用它。这里有一个相关的 .

 <form name="formName" class="form-horizontal">
   <tr ng-repeat="notify in $ctrl.Channel.notify">
    <td>{{notify.severity}}</td>
    <td><input type="Text" name="name{{$index}}" ng-model="notify.name" ng-maxlength="16">
      <div ng-show="formName['name' + $index].$dirty" ng-messages="formName['name' + $index].$error" style="color:maroon" role="alert">
        <div ng-messages-include src="formNameErrorMessages"> </div>
     </div>
    </td>
   </tr>
 </form

在你的情况下可能是这样的：

<tr data-ng-repeat="item in $ctrl.tableData">
  <td>
    <select  name="select{{$index}}"
     data-ng-options="item.appAndType for item in item.serviceUIs" 
     data-ng-model="selectedItem" 
     data-ng-change="$ctrl.transactionListFilter(selectedItem)" >
     <option value="">Multiple</option>
    </select>
  </td>

$scope.formName['select' + $index].$dirty;

查找在 ng 重复中选择的 ng 选项

Finding ngOption selected within ngRepeat

javascript

angularjs

ng-options