如何设置对象的标志而不影响angularjs中的其他$ scope值?

时间:2016-03-21 06:51:15

标签: javascript angularjs angularjs-directive angularjs-scope

Here I added sample for Move Items From One List to Another

enter image description here

当我移动物品时,我需要将标志设置为“D”,以便从我移动的地方移动物品,我需要将标志设置为移动物品的“A”。我试过但是如果我改变对象的位置它受影响可以任何人帮助我...

例如: - 我试图将Alpha从左向右移动

在左侧对象中: -

    $scope.items = [
  {
    "Key": 0,
    "Description": "Alpha",
    "flag": "D"
  },
  {
    "Key": 1,
    "Description": "Beta",
    "flag": "E"
  },
  {
    "Key": 2,
    "Description": "Gamma",
    "flag": "E"
  },
  {
    "Key": 3,
    "Description": "Delta",
    "flag": "E"
  },
  {
    "Key": 4,
    "Description": "Epsilon",
    "flag": "E"
  }
];

在右侧对象中: -

 $scope.items1 = [
  {
    "Key": 5,
    "Description": "Zeta",
    "flag": "E"
  },
  {
    "Key": 6,
    "Description": "Eta",
    "flag": "E"
  },
  {
    "Key": 0,
    "Description": "Alpha",
    "flag": "A"
  }
];

3 个答案:

答案 0 :(得分:1)

这是因为您在对象引用上移动和更新时将同一个对象推入另一个数组,因此在一个数组中对对象进行更改也会更新另一个数组中的同一对象。

根据您描述的要求,您必须首先创建对象的副本,然后在移动时推入阵列,以便您可以替换如下代码:

带有$scope.array1.push(item);

$scope.array1.push(angular.copy(item));

带有$scope.array.push(item);

$scope.array.push(angular.copy(item));

此处angular.copy会创建对象的深层副本。

请参阅plnkr上述更改:http://plnkr.co/edit/at5x3hB9iq8DZCzpD5qP?p=preview

答案 1 :(得分:0)

您只需更新一个对象,将相同的引用添加到另一个数组并更新此引用。因此,第二次更新将被丢弃。

在您的情况下,您需要在将对象添加到另一个数组之前克隆该对象。您需要使用像id这样的独特属性来搜索它们。

查看此帖子以了解克隆对象How do I correctly clone a JavaScript object?,或者您可以使用angular.copy

答案 2 :(得分:0)

正如其他人解释的那样,因为你在列表之间移动相同的项目。更好的解决方案是创建一个包装器对象。这样你就不需要复制每个项目的整个结构,而只需要创建一个小的变换项目"您添加到列表中。

因此,不是自己添加项目,而是将flag属性移动到外部类,而是在数组中使用它。

var oldItem = $scope.array[index];
oldItem.flag = 'D';
var changedItem = { flag: 'A', item: oldItem.item }
$scope.array1.push(changedItem)