Question

我使用纯HTML选择框来过滤ngRepeat结果，如下所示：

<select ng-model="theFilter.choice">
    <option value="">Any</option>
    <option value="Yes">Yes</option>
    <option value="No">No</option>
</select>

<select ng-model="theFilter.otherChoice">
    <option value="">Any</option>
    <option value="Yes">Yes</option>
    <option value="No">No</option>
</select>

<div class="col-xs-12" 
     ng-repeat="item in options | filter: { showMe: theFilter.choice, amIDeleted: theFilter.otherChoice }">
    <p>{{ item.showMe }}</p>
    <p>{{ item.amIDeleted }}</p>
</div>

这是按预期工作的。但是，就像我们都知道浏览器选择框的样式不是很好，所以我试图用ui-select选择框替换普通选择框，但这些选择框无法正常工作。

See plunker here

首先更改ui-select时，没有任何反应。但是，当首先选择选择框时，可以使用ui-select。然后，我可以同时使用ui-select和HTML5选择框。但我只想使用ui-select。

我的问题是：有什么方法可以使用ui-select代替普通的选择框来过滤我的搜索结果吗？

Answer 1

您可以尝试使用示例方案的ui-select和过滤器选项的plunker示例：

<强>控制器：

$scope.theFilter = { 
    showMe: $scope.options[0].showMe, 
    amIDeleted: $scope.options[0].amIDeleted  
};

使用ngRepeat过滤器将选择更改为ui-select

1 个答案: