如何在同一个 ui-select 字段上同时应用 filter:$select.search 和 limitTo:$select.infiniteCurrentLimit？

Question

我有 ui-select 字段正在使用无限滚动功能，因为它可能有大量选项，但由于选项太多，向下滚动查找会很累所需的选项。

<ui-select-choices 
    infinite-scroll="$select.infiniteStepIncrement()"
    infinite-scroll-distance="2"
    infinite-step="2"
    current-limit="10"
    all-options="app.bigList"
    repeat="option.id as option in app.bigList | limitTo: $select.infiniteCurrentLimit">
    <span ng-bind-html="option.value"></span>
</ui-select-choices>

所以我决定在其上实施过滤器：$select:search。它过滤了选项，但它取消了可滚动的功能。

<ui-select-choices 
    infinite-scroll="$select.infiniteStepIncrement()"
    infinite-scroll-distance="2"
    infinite-step="2"
    current-limit="10"
    all-options="app.bigList"
    repeat="option.id as option in app.bigList | filter: $select.search | limitTo: $select.infiniteCurrentLimit">
    <span ng-bind-html="option.value"></span>
</ui-select-choices>

有什么我可以做的让他们能够一起工作吗？

Answer 1

经过大量谷歌搜索和反复试验后找到了解决方案。我只是将 app.bigList 和 filter 分组，这样它将 return 作为一个已经过滤的列表供 limitTo 处理。有点像PEMDAS的作品。

repeat="option.id as option in (app.bigList | filter: { value: $select.search }) | limitTo: $select.infiniteCurrentLimit">

如何在同一个 ui-select 字段上同时应用 filter:$select.search 和 limitTo:$select.infiniteCurrentLimit？

How to apply both filter:$select.search and limitTo:$select.infiniteCurrentLimit on the same ui-select field?

javascript

infinite-scroll

angularjs

ui-select