Question

我是AngularJS（1.6.9版）的新手，并且已经尝试了几天了。

因此，我一直试图实现的是一个购物车网站，您可以在其中选择要购买的商品，单击结帐，然后转到结帐页面，您可以在其中查看购物车中的商品和总价。问题是，当用户单击“结帐”并且加载了结帐页面时，应该显示他们选择的产品及其总价格。我已将所有这些信息存储在购物车模块的控制器中，但问题是如何从结帐模块的控制器访问该信息。我尝试创建服务，将信息存储在此处，然后将其注入到检出控制器，但是我无法正确地将信息从控制器存储到服务中。

'use strict';

//define CART module
angular.module('cart', ['ngRoute'])
//configuration for CART module
.config(['$routeProvider', function($routeProvider){
  $routeProvider.when('/cart', {
    templateUrl: '/public/cart/cart.html',
    controller: 'cartCtrl as vm'
  });
}])
.controller('cartCtrl', function(){
  this.chocolate =[
    {
      pack: '3',
      price: 5,
      checkState: false
    },
    {
      pack: '5',
      price: 7,
      checkState: false
    },
    {
      pack: '10',
      price: 10,
      checkState: false
    }
  ]
  this.honey = [
    {
      pack: '3',
      price: 5,
      checkState: false
    },
    {
      pack: '5',
      price: 7,
      checkState: false
    },
    {
      pack: '10',
      price: 10,
      checkState: false
    }
  ]
  this.candy = [
    {
      pack: '3',
      price: 5,
      checkState: false
    },
    {
      pack: '5',
      price: 7,
      checkState: false
    },
    {
      pack: '10',
      price: 10,
      checkState: false
    }
  ]

  this.totalCost = 0;
  this.calculateTotal = function (checked, price) {
    if (checked) {
      this.totalCost += price;
    } else {
      this.totalCost -= price;
    }
  }

});

'use strict';

angular.module('checkout', ['ngRoute'])
.config(['$routeProvider', function($routeProvider){
  $routeProvider.when('/checkout', {
    templateUrl: 'public/checkout/checkout.html',
    controller: 'checkoutCtrl'
  });
}])
.controller('checkoutCtrl', ['$scope', function($scope){

}]);

Answer 1

首先，您不应该在两个模块中都注入ngRoute，而应该在主模块中注入它。

angular.module('checkout', ['ngRoute']) //remove ngRoute from here

第二，只需将第二个模块作为依赖项注入到第一个模块中，在此处添加签出

angular.module('cart', ['ngRoute','checkout'])

AngularJS在不同模块之间共享存储在控制器中的数据

1 个答案: