从给定文本开始的Angularjs过滤搜索

Question

我有以下html代码：

  <p><input type="text" ng-model="test"></p>
  <ul>
   <li ng-repeat="x in names | filter:test">
    {{ x }}
   </li>
  </ul>

和相应的JS是：

<script>
angular.module('myApp', []).controller('namesCtrl', function($scope) {
    $scope.names = [
        'Jabi',
        'Cabi',
        'Margareth',
        'Hege',
        'Joe',
        'Gustav',
        'Birgit',
        'Mary',
        'Kai'
    ];
});
</script>

问题是当我键入“ bi”时，过滤器将返回所有包含“ bi”的名称，但是我希望该过滤器应仅返回以“ bi”开头的名称（或watever被写在输入文本框中）

Answer 1

由于您只需要匹配的大小写/字母，因此您必须按如下所示创建自定义过滤器，

演示

 angular.module('myApp', []).controller('namesCtrl', function($scope) { $scope.names = [ 'Jabi', 'Cabi', 'Margareth', 'Hege', 'Joe', 'Gustav', 'Birgit', 'Mary', 'Kai' ]; $scope.onlyMatch = function (input, output) { var Str = (input + "").toLowerCase(); return Str.indexOf(output.toLowerCase()) === 0; } });

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <body ng-app="myApp" ng-controller="namesCtrl"> <p><input type="text" ng-model="test"></p> <ul> <li ng-repeat="x in names | filter:test:onlyMatch"> {{ x }} </li> </ul> </body>

从给定文本开始的Angularjs过滤搜索

问题描述

1 个解决方案

解决方案1
2 2018-01-31 07:05:36

从给定文本开始的Angularjs过滤搜索

问题描述

1 个解决方案

解决方案1 2 2018-01-31 07:05:36

解决方案1
2 2018-01-31 07:05:36