Атрибуты применяются ко ВСЕМ элементам, а не только к текущему элементу?

Я использую 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}
];

У меня есть вход, который позволяет мне изменять интенсивность каждого цвета. Когда я нажимаю кнопку ПРИМЕНИТЬ, цвета [] копируются в массив элементов [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 angularjs overwrite
person Kangze Huang    schedule 22.12.2015    source источник
comment
Можете ли вы поделиться шаблоном элемента или минимально воспроизводимым примером ..?   -  person T J    schedule 22.12.2015
comment
Не изменяйте функцию $scope.apply, ЕГО УГЛОВАЯ ФУНКЦИЯ! :D   -  person KoIIIeY    schedule 22.12.2015
comment
назовите свою функцию myApply или что-то еще   -  person KoIIIeY    schedule 22.12.2015

Ответы (1)


arrow_upward
1
arrow_downward

Мне кажется, что это как-то связано с проблемой глубокого копирования массивов 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
};

Просто попробуйте.

person Yogesh    schedule 22.12.2015
comment
К сожалению, это не сработало. Я вернусь к этой проблеме позже, так как мои основные цели AGILE имеют более высокий приоритет. Спасибо за помощь! - person Kangze Huang; 23.12.2015