通过单向绑定的过滤功能，在自定义角度下拉列表中提高角度性能

Question

我有一个自定义角度组件，用作具有过滤功能的下拉选择元素。输入是具有几个角度指令的基本输入元素：

 <input type="text" class="form-control" ng-change="ctrl.filterTextChangeLocal($event)" ng-model="ctrl.ngModelValue" ng-click="ctrl.openDropdown($event)" />

上述输入负责打开下拉列表并允许用户键入，因为用户键入下拉列表元素中的数据会相应过滤。使用基本角度滤波器在控制器中进行滤波：

 ctrl.filteredItems = ctrl.$filter("filter")(ctrl.items, ctrl.ngModelValue);

下拉元素如下所示：

 <table class="table">
        <thead>
            <tr>
                <th ng-repeat="heading in ctrl.gridColumnHeaders" class="text-center">{{heading}}</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="row in ctrl.filteredItems" ng-mousedown="ctrl.onSelectedLocal(row, $event)">
                <td ng-repeat="value in ctrl.sort(row) track by $index" class="text-center">
                    {{value}}
                </td>
            </tr>
        </tbody>
    </table>

所有工作正常，但是随着传递到组件中的项目数量的增加（100个项目）和下拉列表的相应增加，过滤速度很慢。这意味着当我键入一个字符时，下拉列表的过滤会滞后。

我知道角度滤波器的性能并不是最好的，但我相信大部分延迟来自ng重复和双向绑定。我无法在ng内部创建单向绑定，请重复以下内容：

  ng-repeat="value in ::ctrl.filteredItems" 

因为我失去了过滤的绑定。将只在值上设置单向绑定以提高性能：

  {{::value}}

或者，提高性能的最佳方法是什么？确实需要尝试并保持在角度框架中，以便寻找角度解决方案。

谢谢

Answer 1

您是否尝试过简单地应用：

one-time-binding="true"

直接在ng上重复？

通常，对100个元素进行双向绑定不会影响性能，但如果循环中有嵌套循环，则。。