einen Filter auf eine Objektvariable in Angular zuweisen JS

Question

Ich habe ein ng-repeat einen Filter wie folgt aus:

#1 
<div class="contestReports" ng-repeat="contest in contests | filter:{votingOver:true}"> 
    <contestreport></contestreport> 
</div> 

ich es zulassen wollen der Kunde in der Lage sein zu filtern, so habe ich den Filter ein zugewiesen Variable wie folgt aus:

#2 
<div ng-init="reportFilter = {votingOver:true}"></div> 
<div class="contestReports" ng-repeat="contest in contests | filter:reportFilter"> 
    <contestreport></contestreport> 
</div> 

-Code #1 arbeitet aber-Code #2 ist nicht und ich bin nicht sicher, warum.

Answer 1

Haben Sie versucht, auch ng-init

<div ng-init="(reportFilter = '{votingOver:true}')"></div> 

jedoch zu wickeln, wie ich in meinem Kommentar gesagt habe früher - angularjs documentation besagt, dass ngInit mit in allen Fällen meist eine schlechte Praxis ist. Das sollte also, wenn möglich, keine Lösung für Ihr Problem sein.

Und Ihre # 2 Code tatsächlich funktioniert, überprüfen Sie bitte diese zupfen - http://plnkr.co/edit/dBDyYPd3ZoUVdXngu52t?p=preview

//html 
    <div ng-init="reportFilter = {votingOver:false}"></div> 
<div class="contestReports" ng-repeat="contest in contests | filter:reportFilter"> 
    {{contest | json}} 
</div> 

    </div> 

//js in controller 
    $scope.contests = [ 
    {id:1, title:'1', votingOver:false}, 
    {id:2, title:'2', votingOver:true}, 
    {id:3, title:'3', votingOver:true} 
    ]; 

Answer 2

Mit ng-init is not a good way to go with (wie Sie Winkel docs sehen kann, hat Warntext in rot hinzugefügt). Wie Sie wissen, wird es nur beim ersten Rendering ausgewertet (wie ng-init wertet seinen Ausdruck in preLink Phase).

Mit Blick auf Ihren Code scheint es reportFilter Variable wird ein gemeinsames Objekt für alle contests sein. Korrigiere mich, wenn ich falsch liege?

Ich würde diesen Wert in einem Controller nur einmal wie unten hinzufügen.

//place this inside your controller 
$scope.reportFilter = { votingOver : true }; 

Und direkt auf Ansicht selbst verwenden.

<div class="contestReports" ng-repeat="contest in contests | filter:reportFilter"> 
    <contestreport></contestreport> 
</div> 

Answer 3

bessere Art und Weise ist das Ergebnis der Anwendung Filter auf die JSON-Daten in einer Variablen vor ng-Wiederholung liest Elemente in der jsonArray wie unten zu speichern.

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app> 
 
    <div ng-init="contests= 
 
     [{name:'bad apple', votingOver:false}, 
 
     {name:'pleasurebuilder', votingOver:true}, 
 
     {votingOver:true}]"> 
 
    </div> 
 
    <div ng-init="reportFilter = {votingOver:true}"> 
 
    </div> 
 
    <div ng-repeat="contest in revoluza = (contests | filter: reportFilter)"> 
 
    {{contest}} 
 
    </div> 
 
    <hr> 
 
</div>

Answer 4

Code 2 funktioniert nicht, weil Sie benutzerdefinierte Filter erstellen, während Sie nur Initialisieren div nicht Filter erstellen

Code 1 arbeitet, weil Sie die richtige Syntax für Standard verwenden Filter, der mit jedem Objekt verglichen werden kann, so wie Sie es getan haben