Angular - Inkrementieren Wert erzeugt Digest Fehler

Question

Ich kenne das Problem, das ich habe, aber ich kann nicht einen Weg um es herum. Egal, was ich mache, bekomme ich einen Digest-Fehler. Das Problem, das ich glaube, ruft die "getPlayerIcon" -Methode innerhalb der ng-Wiederholung.

HTML:

<div class="col-md-2" ng-repeat="player in team.players"> 
    <img class="card-img-player" ng-src="/{{player.position}}/{{getPlayerIcon(player.position)}}" data-holder-rendered="true" style="height: 270px; width: 100%; display: block;"> 
</div> 

AngularJS:

$scope.getPlayerIcon = function(position) { 
if ($scope[position] === undefined) 
    $parse(position).assign($scope, 1); 

$scope[position]++; 
return $scope[position]; 
} 

"Player" enthält eine 'Position' Feld, das ein Verteidiger oder Angreifer sein kann. Die Methode 'getPlayerIcon' übernimmt die Position als Parameter und erstellt dann entweder eine Bereichsvariable mit dem Positionsnamen, entweder mit dem Wert 1, wenn es sich um die erste Position handelt, oder sie wird um eins erhöht diese Position.

Das Problem, das ich habe, ist, dass ein Verfahren auf ng-src Aufruf der Wert jedes Mal ändert es im ng-Wiederholung genannt, die verdauen Fehler in dem berüchtigten Indig Ergebnisse:

angular.js:68 Uncaught Error: [$rootScope:infdig] 10 $digest - `iterations reached. Aborting!` 

Wie kann ich repariere das? Ich muss inkrementieren, weil zum Beispiel, wenn es 4 Verteidiger und 4 Angreifer in den Team.Playern gibt, ich in der Lage sein werde, Bilder mit Defender/1, Defender/2, Defender/3, Defender/4, Angreifer/1, Angreifer/2, Angreifer/3, Angreifer/4. Im Grunde brauche ich es, um die Position zu identifizieren, und habe eine Zählung dieser Position, um das richtige Bild herauszuziehen.

Hilfe!

Danke, FYP

Answer 1

Verwenden Sie einfach die $index.

<div class="col-md-2" ng-repeat="player in team.players track by $index"> 
    <img class="card-img-player" ng-src="/{{player.position}}/{{getPlayerIcon(player.position, $index)}}" data-holder-rendered="true" style="height: 270px; width: 100%; display: block;"> 
</div> 

Dies wird Ihnen in der Schleife den Index der aktuellen Iteration geben und dann wird es nicht nötig sein Schritten in Ihrer Methode zu tun (Sie können stattdessen in der $ Indexwert vergehen und man ihm hinzufügen).