Question

我是angularjs的新手。我在某个地方找到了以下示例，它的工作正常。但是，我不了解自定义指令控制器中的数据如何与工厂数据同步。这是代码：

angular.module("cart",[]).factory("cart", function(){
   var cartData = [];
   return{
     addProduct:function(id, name, price){
       cartData.push({count:1, id:id, price:price, name:name})
     },
     getProduct: function(){
       return cartData;
     }
   };
}).directive("cartSummary", function(cart){
    return{
      restrict: "E",
      template:"cartSummary.html",
      controller: function($scope){
        var cartData = cart.getProduct();

        $scope.totalPrice = function(){
          var total = 0;
          for(var i=0; i<=cartData.length; i++){
            total+= (cartData[i].price * cartData[i] * count);
          }
        }
      }
    }
});

在另一个模块中，我有以下代码来更新cartData：

angular.module("store", ["cart"]).controller("storeCtrl", function($scope, cart){
  /*some logic here*/
  $scope.addToCart = function(){
    cart.addProduct(product.id, product.name, product.price);
  }
});

以下是观点：

<html ng-app="store">
   <body ng-controller="storeCtrl">
     <!--some html-->
     <cart-summary/>
     <!--some html-->
     <button ng-click="addToCart(item)">Add To Cart</button>
   </body>
</html>

指令模板：

 <div class="navbar-text">
    {{totalPrice()}}
 </div>

我知道每次用户点击＆＃34;添加到购物车＆＃34;工厂中的cartData都会更新。按钮，但我不知道工厂中cartData事实背后的魔力总是与定制指令控制器中的数据同步。每次调用函数$ scope.totalprice（）是什么时候？

有人可以向我解释一下吗？非常感谢你！

Answer 1

实际上非常简单。在javascript中，我们使用的所有对象，数组和函数实际上都是通过引用使用的，而其他数据类型则按值使用。

你调用getter获取对象的引用并不重要，重要的是它实际上是一个引用而不是对象本身，所以当你添加一个新项目时，你要将它添加到独特的数据来源。

试试这个，在你的指令中把这个代码放在一个新方法中，然后用$ scope.cartData作为你在视图上使用的引用来执行它：

$scope.cartData = {}; //you are destroying the reference but not the real object
$scope.cartData = cart.cartData; //you will get all your items back on play as it refreshes the reference with the original one

{{totalPrice（）}}一切都改变了，这里angular不知道totalPrice函数的结果是否可以在两个不同的摘要周期之间改变，所以框架必须在每个周期重新执行该函数来检查。

为了不使应用程序表现不佳，应该避免这种插值，因为它们被认为是一种不好的做法，特别是如果函数内部有很重的逻辑。解决这个问题的方法是预先计算函数的结果并将其分配给作用域内的新属性，并使插值监听该属性而不是执行函数。

希望这个解释有所帮助！

干杯！

自定义指令控制器数据与工厂数据同步

1 个答案: