配列にオブジェクトを追加するAngularJSはすべての類似したオブジェクトを更新します

Question

WebAPIからデータを取得し、スコープ付き可変配列製品に格納しています。

$scope.products 

私も、私がやろうとしています何秒スコープのアレイ

$scope.selectedFish = []; 

は、製品の配列の製品を見つけ、それを修正し、selectedProducts配列にそれを追加されています。

次の関数は、同じコントローラで宣言しています。

// 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(); 
      } 

これは、作業を行いますが、私は別のFishName値で二回同じ製品を追加した場合、それは最後のFishNameは、入力されたと同じselectedProductのために、アレイ内のすべてのエントリを更新難しさを持っています。

Answer 1

オブジェクト参照として起きることは同じです。 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

この目的でangular.copyを試してください。それは角度マニュアル（https://docs.angularjs.org/api/ng/function/angular.copy）で述べているように

angular.copy

オブジェクトまたは配列でなければならないソースのディープコピーを作成します。

宛先が指定されていない場合は、オブジェクトまたは配列のコピーが作成されます。

宛先が指定されている場合は、その要素（配列）またはプロパティ（オブジェクト）がすべて削除され、ソースのすべての要素/プロパティがコピーされます。 sourceでない場合

はobject又はarray（INC。null及びundefned）、sourceが返されます。 sourceがdestinationと同じ場合は、exceptionが投げられます。