Angular js: ng-repeat 过滤器 returns 未定义

Question

我想实现的是字母过滤器。从 A 到 Z 的按钮，用于过滤数据。单击字母 A 按钮时，应显示所有带 A 的数据，其余数据将隐藏。

这是我迄今为止尝试过的方法，但问题出在 ng-repeat 过滤器中 returns undefined。每次我单击字母表按钮时，$scope.filterActive return 的参数都会显示在下面的屏幕截图中，但 $scope.active return 是被单击的字母表。

Angular:

$scope.alphabet = "a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z".split(",");

    $scope.active = null;
    $scope.setActiveLetter = function(letter) { 
        $scope.active = letter.toLowerCase();
        $scope.selectedLetter = letter.toLowerCase();
    };

    $scope.filterActive = function(value) {
        if ($scope.active) {
            // return value.charAt(0).toLowerCase() === $scope.active;
        }
        return true;
    }

查看：

<button type="button" class="btn-alphabet btn btn-default" ng-bind="letter" ng-repeat="letter in alphabet" ng-click="setActiveLetter(letter)" ng-class="{'btn-primary': letter==active}">{{ letter }}</button>

<div class="manufacturers-content" ng-repeat="data in manufacturers | filter:filterActive">
   <a ui-sref="manufacturersDetail({id: data.id})">
      {{ data.name }} <span>({{ data.documents.length }})</span>
   </a>
</div>

我已经尝试关注这篇文章：https://toddmotto.com/everything-about-custom-filters-in-angular-js/

我的 JSON 来自 $http.get 的数据 return 类似这些，但真实数据来自客户端，其中包含大约数百个数据：

1:{id: "53", name: "TEST 0", documents: Array(5), $$hashKey: "object:34"}
2:{id: "69", name: "Test 1", documents: Array(7), $$hashKey: "object:36"}
3:{id: "46", name: "Test 2", documents: Array(45), $$hashKey: "object:38"}
4:{id:"70", name: "Test 3", documents: Array(2), $$hashKey: "object:40"}

Answer 1

您需要确保数据在数组变量中可用，当您要应用过滤器时。

请检查以下示例代码

 //make sure data is available or not 
 $scope.manufacturers = [];

 $scope.filterActive = function(value) {
    if ($scope.active) {
        // return value.charAt(0).toLowerCase() === $scope.active;
    }
    return true;
  }

  //for example your calling API

  function getdata(){
    //response
     $scope.manufacturers = response.length ? response : [];
  }

 getdata();

请检查 jsfiddle here。

希望对您有所帮助！

Angular js: ng-repeat 过滤器 returns 未定义

Angular js: ng-repeat filter returns undefined

javascript

angularjs

angularjs-ng-repeat