属性将应用于所有项目,而不仅仅是当前项目

Attributes are applied to ALL items instead of just current item?

本文关键字:项目 不仅仅是 属性 应用于      更新时间:2023-09-26

我正在使用AngularJS,并试图记录各种物品的独特色调。我有一个项目阵列和一个颜色阵列:

$scope.item = [
  {name:"Toy Car", colors:[]},
  {name:"Toy Boat", colors:[])
];
$scope.colors = [
  {id:"Red", intensity:256},
  {id:"Green", intensity:256},
  {id:"Blue", intensity:256}
];

我有一个输入,允许我改变每种颜色的强度。当我单击APPLY按钮时,颜色[]被复制到项目数组[0]中。colors.

<input type='number' ng-model='colors[0].intensity'> //repeat for each color RGB
<button ng-click='apply()'>APPLY</button>
$scope.apply = function(){
  $scope.color_this = angular.copy($scope.colors, $scope.color_this);
  $scope.item[0].colors = angular.copy($scope.color_this, $scope.item[0].colors);
  $scope.color_this = []; // blank array to make room for the next RGB mix
};

在我转到下一个$scope.item[1].colors之前,这项操作非常有效。当我尝试设置$scope.item[1]的下一个颜色时,以前的项目颜色也会被覆盖。即:

$scope.item[0].colors === $scope.item[1].colors // evaluates to true

但我不想这样!我希望每件物品都能保持自己独特的颜色。我的逻辑有什么根本错误吗?为什么以前的项目颜色会被覆盖??

对我来说,这似乎与Javascript数组的深度复制问题有关。我建议跳过angular.copy()的第二个参数。查看此处的文档https://docs.angularjs.org/api/ng/function/angular.copy

像这样的。。。

$scope.apply = function(){
  $scope.color_this = angular.copy($scope.colors);
  $scope.item[0].colors = angular.copy($scope.color_this);
  $scope.color_this = []; // This line is not needed since copy will create a new array each time, so you can remove this
};

试试看。