Angularjs Filter funktioniert nicht mit ng-repeat

Question

Angularjs Filter funktioniert nicht mit ng-repeat, wenn ich den Filterwert mit einer Funktion ändere ... Ich bin neu bei angularjs.

Dies sind meine HTML-Buttons, von denen der Filterwert mit der Funktion 'ng-click' geändert werden muss;

<span> 
    <a class="button button-stable" ng-class="class('static')" 
     ng-click="activate('static','','')"> 
     All 
    </a> 
</span> 
<span ng-repeat="profiles in cardList | unique:'profile'"> 
    <a class="button button-stable" ng-class="class($index)" 
     ng-click="activate($index,profiles,profiles.profile);"> 
     {{profiles.profile}} 
    </a> 
</span> 

sind meine Controller-Funktionen sind;

$scope.cardList = [ 
    {id: 1, serial_number: '35986580', card_number: 'BG9S8W7DJSKLA9', profile: '512', expiry_date: '5-1-2017'}, 
    {id: 2, serial_number: '35986581', card_number: 'ASLWODS6F5812H', profile: '512', expiry_date: '5-1-2017'}, 
    {id: 3, serial_number: '35986582', card_number: '9A5S218LSKJBMC', profile: '768', expiry_date: '5-1-2017'}, 
    {id: 4, serial_number: '35986583', card_number: 'XLCKDIGOSJS092', profile: '1024', expiry_date: '5-1-2017'}, 
    {id: 5, serial_number: '35986584', card_number: 'XKSODKO0CNJSUW', profile: '1024', expiry_date: '5-1-2017'}, 
    {id: 6, serial_number: '35986585', card_number: 'PLHG0G9M746172', profile: '2048', expiry_date: '5-1-2017'}, 
    {id: 7, serial_number: '35986586', card_number: '5DF888F9EGVNDJ', profile: '2048', expiry_date: '5-1-2017'}, 
    {id: 8, serial_number: '35986587', card_number: 'D6F5G49ILMA9SF', profile: '4096', expiry_date: '5-1-2017'} 
]; 
$scope.class = function(index, item){ 
    if ($scope.selected == index){ 
     return 'button-dark active'; 
    } else { 
     $scope.staticAll = ''; 
     return ''; 
    } 
} 
$scope.activate = function(index, item, profile){ 
    if (index != 'static'){ 
     $scope.selected = index; 
     $scope.filterProfile = profile; 
     $scope.staticAll = ''; 
    } else { 
     $scope.selected = 'static'; 
     $scope.filterProfile = ''; 
     $scope.staticAll = 'button-dark active'; 
    } 
} 

Und das ist, wo der Filter nicht funktioniert;

<tr ng-repeat="card in cardList | filter: filterProfile"> 
       <td class="center">{{card.profile}}</td> 
       <td class="center">{{card.expiry_date}}</td> 
       <td class="center"><a class="button button-medium button-energized">Assign</a></td> 
      </tr> 

Dies ist ein Bild;

Ich möchte die Ergebnisse mit Profiltasten filtern, aber der Wert von ‚filter‘ nicht ändert ...

Bitte helfen ...

Answer 1

bin ich nicht so klar, was Sie für ein Endprodukt möchten, aber ich kann Ihnen sagen, dass nicht benutzerdefinierte Filter definiert sind. Das Format ist so etwas wie

var app = angular.module('buttonApp',[]); 
    app.filter('myFilter', function() { 
    return function(x) { 
     //filter goodness in here 
     }  
    }) 

Sie die offizielle Dokumentation für Filter hier https://docs.angularjs.org/tutorial/step_11

Answer 2

Was finden Sie sollten ein Modell seiner Filteroption zu tun ist, nehmen, ich kann mir vorstellen, dass die div-Tags mit diesen Zahlen im Besonderen.

Jetzt kann ich nicht ganz verstehen, wie eine Waffe Profile der Wunschliste, sondern in ihren Profilen, müssen Sie ng-Modell wie ng-model = "profileSelected"

Und zu Ihrer Liste hinzufügen

<ion-item ng-repeat="card in cardList | filter: profileSelected"> 

für eine bessere Hilfe geben , können Sie einen Codepen erstellen?