如何知道角度的过滤阵列的长度

Question

我有一个搜索栏，让用户可以使用角度基于其输入进行过滤。现在，当用户输入的搜索词与数组中的任何内容不匹配时，现在我希望能够显示“Nothing与您的搜索相匹配”的消息。

我试着用ng-change来监视用户的输入，然后循环遍历数组搜索用户输入的每个参数，但是这并不奏效。这是我的代码示例。

HTML

<input ng-model="search" ng-change="check(search)"> 
<h4 ng-if="found === 0 ">Nothing matches your search</h4> 
<div ng-controller="imCtrl" ng-repeat="imprest in imprests | filter:search"> 
    <h2>{{imprest.name}}</h2> 
</div> 

控制器

var office = angular.module('Office'); 

office.controller('imCtrl',[$scope,function('$scope'){ 
    $scope.imprests = [ 
      {name:'John'}, 
      {name:'Peter'} 
    ] 

    $scope.check = function (word) { 
     var found = 0 
     $scope.searching = true 
     for (var i = 0; i < $scope.vendorForms.length; i++) { 
      if($scope.imprests[i].name.includes(word){ 
       found++ 
      } 
     } 
     $scope.found = found 
     $scope.searching = true 
     $scope.done = true 
    } 
}) 

是否有可能知道过滤数组的长度因此可以显示一个消息？

Answer 1

您可以使用一个别名：

ng-repeat="imprest in imprests | filter:search as filtered" 

然后你就可以访问：

{{filtered.length}} 

Answer 2

你可以写一个过滤功能，并用它来过滤你的角码的排列，然后检查它的长度。

$scope.myFilter(){ 
    // ... here your logic 
    // you need to compare with $scope.search 
    // and then return the new array and check it's length 
} 

的标记，你可以像使用

<div ng-controller="imCtrl" ng-repeat="imprest in myFilter()"> 
    <h2>{{imprest.name}}</h2> 
</div> 

Answer 3

你应该能够使用(imprests | filter:search).length == 0要做到这一点，然后，而不是你的ng-change功能，你可以简单地添加一个ng-show显示错误，像这样：

<input ng-model="search"> 
<h4 ng-if="found === 0 ">Nothing matches your search</h4> 
<div ng-controller="imCtrl" ng-repeat="imprest in imprests | filter:search" ng-show="(imprests | filter:search).length !== 0"> 
    <h2>{{imprest.name}}</h2> 
</div> 
<div ng-show="(imprests | filter:search).length === 0"> 
    <h2>No results found</h2> 
</div>