在angularjs下拉菜单multiselect中删除ng-repeat选定项目onItemSelect事件之一

时间:2019-07-16 10:23:13

标签: javascript angularjs

我在表单上使用AngularJS Dropdown Multiselect。如果满足条件,在selectedItem事件上删除onItemSelect的最快方法是什么?

<tr ng-repeat="detail in mainCtrl.lineDetails">
    <td>
        <div ng-dropdown-multiselect="true" options="mainCtrl.Options" 
             selected-model="detail.SelectedOptions"
             extra-settings="{
               searchField: 'name',
               enableSearch: true,
               displayProp: 'name',
               scrollableHeight: '300px',
               scrollable: true,
               keyboardControls: true,
               idProperty: 'id',
               buttonClasses: 'form-control drpdwn-btn',
               styleActive: true,
               selectionLimit:detail.SelectedLimit}"
             events="{ onItemSelect: mainCtrl.checkSelected,
                       onSelectAll: mainCtrl.checkSelectedAll }">
        </div>
    </td>
</tr>

当前,我只是遍历整个mainCtrl.lineDetails,然后遍历detail.SelectedOptions,然后检查每个项目是否具有相同的ID,然后检查是否满足我的条件,然后从数组中删除。

1 个答案:

答案 0 :(得分:0)

您可以在ng-repeat上跟踪索引,而不是在Item Select上传递索引并从mainCtrl.lineDetails数组拼接元素。

示例:

<tr ng-repeat="(index, detail) in mainCtrl.lineDetails">
    <td>
    <div ng-dropdown-multiselect="true" options="mainCtrl.Options" 
         selected-model="detail.SelectedOptions"
         extra-settings="{
           searchField: 'name',
           enableSearch: true,
           displayProp: 'name',
           scrollableHeight: '300px',
           scrollable: true,
           keyboardControls: true,
           idProperty: 'id',
           buttonClasses: 'form-control drpdwn-btn',
           styleActive: true,
           selectionLimit:detail.SelectedLimit}"
         events="{ onItemSelect: removeLineDetailItem(index),
                   onSelectAll: mainCtrl.checkSelectedAll }">
    </div>
</td>


// Make a function on your ctrl which will be fired onItemSelect event
$scope.removeLineDetailItem(itemIndex) {
   $scope.lineDetails.splice(itemIndex, 1)
}