AngularJS Hinzufügen von Objekt zu Array aktualisiert alle ähnlichen Objekte

Question

Ich erhalte Daten aus einer WebAPI und speichert sie in einem Bereich variabler Bereich Produkte.

$scope.products 

Ich habe auch eine zweite scoped Array

$scope.selectedFish = []; 

Was ich versuche, ein Produkt in dem Produkte-Array zu tun ist, zu finden, modifizieren und in die selectedProducts Array hinzuzufügen.

Ich habe die folgende Funktion auf dem gleichen Controller deklariert.

// Function to add a new fish to the selectedFish array 
      $scope.add = function() { 
       // Find existing fish from products list 
       var newFishToAdd = $filter('filter') ($scope.products, { Id: $scope.selectedProduct }); 
       // Change the name property 
       newFishToAdd[0].FishName = $scope.selectProductName; 
       // Add new fish to the selected fish array 
       $scope.selectedFish.push(newFishToAdd[0]); 
       $scope.bindModel(); 
      } 

Dies funktioniert, aber ich Schwierigkeiten habe, wo, wenn ich das gleiche Produkt zweimal mit unterschiedlichen FishName Werten hinzufügen, aktualisieren sie alle Einträge in dem Array für die gleiche selectedProduct mit dem letzten FishName eingetragen.

Answer 1

Sein passiert als Objektreferenz ist gleich. Verwende angular.copy().

$scope.add = function() { 
    // Find existing fish from products list 
    var newFishToAdd = $filter('filter')($scope.products, { Id: $scope.selectedProduct }); 

    var obj = angular.copy(newFishToAdd[0]); 
    obj.FishName = $scope.selectProductName; 

    // Add new fish to the selected fish array 
    $scope.selectedFish.push(obj); 
    $scope.bindModel(); 
} 

Answer 2

Sie sollten zu diesem Zweck versuchen, angular.copy zu verwenden. Wie heißt es in Winkel Dokumentation (https://docs.angularjs.org/api/ng/function/angular.copy)

angular.copy

Erstellt eine tiefe Kopie der Quelle, die ein Objekt oder ein Array sein sollte.

Wenn kein Ziel angegeben wird, wird eine Kopie des Objekts oder Arrays erstellt.

Wenn ein Ziel angegeben wird, werden alle seine Elemente (für Arrays) oder Eigenschaften (für Objekte) gelöscht und dann alle Elemente/Eigenschaften aus der Quelle kopiert.

source Wenn kein object oder array (inc. null und undefned), source zurückgegeben. Wenn source mit destination identisch ist, wird ein exception geworfen.