AngularJS typeahead添加了按函数自定义排序

AngularJS typeahead add custom sort by function

本文关键字：函数 自定义 排序 typeahead 添加 AngularJS      更新时间：2023-09-26

我正在尝试构建一个typeahead，它应该得到指定数量的结果，并按startswitch对它们进行排序。

这意味着，如果我有值：阿拉巴马州、密苏里州、马里兰州、马萨诸塞州等，并在输入字段中键入"m"或"m"，则顺序应为马里兰州、密苏里州，马萨诸塞州、阿拉巴马州。

因此，我的代码看起来像这样：

<input class="input-large" type="text" ng-model="selected" 
  typeahead="state for state in states | filter:$viewValue | limitTo:8">

我尝试添加一个自定义过滤功能：

<input class="input-large" type="text" ng-model="selected" 
  typeahead="state for state in states | filter:$viewValue | orderBy:orderByStartsWith()| limitTo:8">

具有以下功能：

$scope.orderByStartsWith = function() {
    return function(element){
        return element.toLowerCase().startsWith($scope.selected.toLowerCase()) ? 0 : 1;         
    }
};

这不起作用，因为作用域值selected没有更新，如此JSFiddle 中所示

有什么解决方案可以得到想要的订单吗？

通过函数将$viewValue传递给订单，并使用它对结果进行排序。

<input class="input-large" type="text" ng-model="selected" typeahead="state for state in states | filter:$viewValue | orderBy:orderByStartsWith($viewValue) | limitTo:8">
 $scope.orderByStartsWith = function(viewValue) {
      return function(element){
        return element.toLowerCase().startsWith(viewValue.toLowerCase()) ? 0 : 1;           
      }
    };

检查小提琴：http://jsfiddle.net/2umL5yqL/1/

相关文章：