Angular js: ng-repeat Filter liefert undefined

Question

Was ich erreichen möchte, ist ein Brief-Filter. Eine Schaltfläche von A bis Z zum Filtern der Daten. Wenn auf den Buchstaben A-Knopf geklickt wird, sollten alle Daten mit A angezeigt werden und der Rest wird ausgeblendet.

Dies ist, was ich bisher versucht habe, aber das Problem ist in der ng-repeat Filter gibt es undefined zurück. Jedes Mal, wenn ich auf die Alphabet-Schaltflächen klickte, kehrte der Parameter $scope.filterActive zu diesem Screenshot zurück, aber $scope.active gibt das Alphabet zurück, auf das geklickt wurde.

Eckig:

$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; 
    } 

Ausblick:

<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> 

ich nach diesem Artikel bereits versucht: https://toddmotto.com/everything-about-custom-filters-in-angular-js/

Meine JSON Daten kehrt aus dem $http.get etwas wie diese, aber dort al Daten kamen vom Client mit rund hundert Daten:

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

Sie müssen sicherstellen, dass Daten in Array-Variable zur Verfügung steht, wenn Sie Filter anwenden möchten.

Bitte überprüfen Sie folgende Beispielcode

//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(); 

Bitte überprüfen jsfiddle zu here.

Hoffe, das wird Ihnen helfen!