Question

在我的angularjs应用程序中，我使用多选下拉https://tamtakoe.github.io/oi.select/#/select/#filtered，其中包含以下内容：

<oi-multiselect  ng-options="item.name for item in ins_Types " ng-model="insuranceTypes"  multiple placeholder="Select" data-ng-required="true" name="insType" ></oi-multiselect >

和

 $scope.ins_Types = [{id: 1, name : "ins1"},{id: 2, name : "ins2"}, {id: 3, name : "ins3"}, {id: 4, name : "ins4"}];

适用于$scope.ins_Types中的所有选项。现在我希望只显示id < 3的选项。所以我使用了过滤器选项，如下所示：

<oi-multiselect  ng-options="item.name for item in ins_Types | filter:{id < 3} " ng-model="insuranceTypes"  multiple placeholder="Select" data-ng-required="true" name="insType" ></oi-multiselect >

但从那时起，多选下拉列表停止响应，并且没有显示任何选项。

我甚至试过| filter:{item.id < 5}但仍然是同样的问题。

Answer 1

您可以为您的需求创建自定义过滤器，例如

app.filter('myfilter', function() {
  return function(input, condition) {
    var filtered = [];
    input.forEach(function(item, index) {
      if (item.id > condition) {
        filtered.push(item);
      }
    });
    return filtered;
  };
});

在您的标记中使用它

<oi-select oi-options="item.name for item in ins_Types | myfilter : 3 track by item.id" ng-model="insuranceTypes" multiple placeholder="Select"></oi-select>

直播Plunker

希望它有所帮助。

过滤多选下拉选项

1 个答案: