0

更新我的控制器 $scope.products 变量后，我需要一些帮助来更新我的视图。

基本上，当用户单击“添加到购物车”按钮时，它需要更新购物车内容视图。我已经粘贴了下面的代码。

我在要更新购物车视图的特定行发表了评论：

 //TBD : update the cartController view, how??

任何帮助非常感谢谢谢！

    'use strict';

    var giftShopApp = angular.module('giftShopApp', []);

    giftShopApp.factory('storeFactory', function($http) {
      return {
        getProducts : function(callback) {
          //$http.get('php/db.php?action=products').success(callback);
          $http.post('php/db.php', { 'action' : 'products' }).success(callback);
        },
        getProductCategories: function(callback) {
          $http.post('php/db.php', {'action': 'product_categories'}).success(callback);
        },
        getProductSuppliers: function(callback) {
          $http.post('php/db.php', {'action': 'product_suppliers'}).success(callback);
        },
        addProduct: function(product, callback) {
          $http.post('php/db.php', {'action': 'addProduct', 'params': product}).success(callback);
        },
        updateProduct: function(callback) {
          $http.post('php/db.php', {'action': 'updateProduct'}).success(callback);
        },
      }
    });

    giftShopApp.factory('cartFactory', function($http) {
      return {
        getCartItems : function(callback) {
          $http.post('php/db.php', {'action' : 'getCartItems' }).success(callback);
        },
        clearItems : function(callback) {
          $http.post('php/db.php', {'action' : 'clearCart' }).success(callback);
        },
        addItemToCart: function(params, callback) {
          $http.post('php/db.php', {'action': 'addItemToCart', 'params' : params}).success(callback);
        }
      }

});

giftShopApp.controller('StoreController', function($scope, storeFactory, cartFactory) {
  storeFactory.getProducts(function(results) {
    $scope.products = results.products; 
  });
  $scope.addToCart = function(id, price, qty){
   //TBD: Check stock level on PHP side
   console.info('qty');
   console.log(qty);
   var params = {'product_id': id, 'qty': qty, 'price': price}; 
   cartFactory.addItemToCart(params, (function(results) {
     //TBD : update the cartController view, how??
     if (results.success) {
       console.log('update cart');
     }
   }));
  };
});

giftShopApp.controller('CartController', function($scope, cartFactory) {
  $scope.cart_total = 0; 
  cartFactory.getCartItems(function(results) {
    var items = results.rows;
    var cart_total = 0;
    $scope.total_amount = 0;
    $scope.items = items; 
    items.forEach(function(o){
      cart_total += parseInt(o.total_amount,10);
    });
    $scope.cart_total = cart_total;
  });
  //checkout
  //increase qty
  //decrease qty
  $scope.clearItems = function() {
    //$scope.items = [];
  }
});

更新：添加了购物车视图

<div class="span2 pull-right"  style="width: 200px;" ng-controller="CartController">
  <div class="nav-list">
    <div id="BSCart" class="collections ui-droppable">
      <div class="ShoppingCartHead" style="">
        <img style="width: 28px;" id="BSC_animation_cart" class="slideUp" src="../images/shoppingcart_yellow.png"></img>
          Shopping
      </div>
      <div class="ShoppingCart" style="margin-bottom: 10px;" ng-repeat="item in items">
        {{item.product_name}}
        <br></br> 
        <div class="pull-right" >{{item.total_qty}} x {{item.product_price}}</div>
      </div>
      <div class="ShoppingCartFoot">
        <div id="BSC_animation_count" class="slideDown">
          <!-- Total 3 products -->
          Total items R {{cart_total}}
          <br></br>
          <div class="pull-right"></div>   
        </div>
        <br></br>
        <!-- add route here to full shopping cart href=#/cart -->
        <a href="#/cart">View shopping cart / Checkout</a>
      </div>
    </div>
  </div>
</div>
4

1 回答 1

1

在您的视图中使用ng-model，以便自动更新值。或者，如果您在购物卡丁车中推送多个产品，您可以使用它ng-repeat来查看存在于购物车中的所有商品$scope.products

于 2013-10-31T06:44:13.283 回答