javascript - 工厂中的 AngularJS 持久对象

Question

我只是在吹嘘我的想法。我不明白下面的代码是如何工作的。

我有一个工厂，里面有一个名为“products”的属性和另一个名为“order”的属性。有两种方法，一种称为“list()”，返回“products”属性，另一种称为“orderList()”，返回“order”。此外，它还有一个名为“add()”的方法，可以从“products”列表中获取“product”，并填充工厂内的“order”列表。之后，我有两个 Controller 和两个列表。一个 Controller 用于可用产品(“产品”属性)，另一个 Controller 用于购物车(“订单”属性)。

在每个 Controller 的开头，我有 $scope.productsList = Product.list()，在另一个 Controller 中有 $scope.productsOrder = Product.orderList()。

产品以产品列表开头。订单开始为空。太完美了。

当我点击 +1 时，“订单”列表中的这两个更改。也不知道为什么。

代码如下: http://codepen.io/anon/pen/lFLbH

Answer 1

我相信您是在问为什么产品列表和购物车中的数量都会发生变化。如果是这样，我的答案是给你的。它是基本的 JavaScript——你在内存中引用同一个对象，所以它在两个 View 中更新。为避免这种情况，您可以在将对象添加到购物车之前复制该对象。

更改将对象添加到购物车的行以制作对象的副本。

 order[product.slug] = angular.copy(newProduct);