Filterung mit Tags in Angular

Question

ich einen Filter mit Winkeln Bindung Kontrollkästchen, um meinen Umfang mit ng-Modell gebaut habe, nach diesem Beispiel Angularjs filtering with checkboxes

Der Filter funktioniert gut, aber ich mochte mit jedem Filter einen Tag anzuzeigen das ist angekreuzt. Dafür habe ich versucht, eine ng-Wiederholung über den Bereich zu machen, in dem alle Filterung durchgeführt wird, aber ich kann den richtigen Text nicht anzeigen.

Meine Markup ist wie folgt:

<div ng-app="myApp" ng-controller="Ctrl"> 
{{ctrlTest}}<hr/> 
<div ng-repeat="elements in filter"> 
    <div ng-repeat="n in elements"> 
     <li ng-repeat="x in n" ng-show="n=true">{{n}} 
      <a ng-click="n=false"> X</a> 
     </li> 
    </div> 
</div> 
</div> 

angular.module('myApp', []) 
.controller('Ctrl', function($scope) { 
    $scope.ctrlTest = "Filters"; 
     $scope.filter = [{"producers": {"Ford":true,"Honda":true,"Ferrari":true}}] 
}); 

Wenn die Filterung durchgeführt wird, die angezeigten Daten sind die in $scope.filter zeigte Mein Problem ist, dass ich nicht die Daten richtig angezeigt bekommen (die gewünschte Ausgabe würde seien Sie drei Etiketten, jede mit jedem Namen: Ford, Honda und Ferrari). Ich möchte auch in der Lage sein, das Etikett zu entfernen, indem Sie in ein X daneben klicken. Hier

ist ein jsfiddle von dem, was ich habe versucht, so weit zu tun: http://jsfiddle.net/Joe82/wjz8270z/2/

Vielen Dank im Voraus!

Answer 1

Das funktioniert. Beachten Sie, dass ich einige Änderungen an Ihrem JSON vornehmen musste. Ihr JSFiddle wurde aktualisiert.

<div ng-app="myApp" ng-controller="Ctrl"> 
    {{ctrlTest}}<hr/> 
    <div > 
     <div ng-repeat="n in filter.producers">   
      <li ng-show="n.checked==true"><a ng-click="remove(n)">{{n.Brand}} X</a> 
      </li> 
     </div> 
    </div> 
</div> 

angular.module('myApp', []) 
    .controller('Ctrl', function($scope) { 
     $scope.ctrlTest = "Filters"; 
      $scope.filter = { 
       "producers": [ 
       { 
       "Brand": "Ford", 
       "checked": true 
       }, 
       { 
       "Brand": "Honda", 
       "checked": true 
       }, 
       { 
       "Brand": "Ferrari", 
       "checked": true 
       }] 
     }; 

    $scope.remove = function(producer){ 
     producer.checked = false; 
     console.log(producer); 
    }  
});