在Angular中跨控制器共享小计

时间:2015-04-20 20:09:54

标签: angularjs

我试图与另一个控制器共享一个控制器中计算的小计。当我使用下面的代码时,出现total is not defined错误。

我非常感谢有关如何使其正常运行的建议。

我使用this Stackoverflow帖子作为模型。

.factory('serviceA', function() {
   var serviceA = {
   amount: null
  };
   return serviceA;
})

.controller('ProjectListCtrl', function ($scope, serviceA, Projects) {
  var projectList = this;
  projectList.projects = Projects;
  serviceA.amount = total;

   projectList.total = function () {

   var total = 0;

   angular.forEach(projectList.projects, function (project) {
    total += project.type.cost;

    });
   return total; //want to use this total in other controller
 };
})

.controller('PaymentFormCtrl',
  function ($scope, $http, serviceA) {
  $scope.serviceA = serviceA;
  console.log(serviceA);
// . . . 
});

1 个答案:

答案 0 :(得分:2)

在这种情况下,您可能希望使用服务,因为服务是单例,这意味着只会创建一个服务,每个控制器将使用相同的服务,而不是使用自己的工厂。

.service('serviceA', function() {
    var amount = 0;
    return {
        get: function () {
            return amount;
        },
        set: function (value) {
          amount = value;
        }
    };
});

在第一个控制器中,您希望在projectList.total函数中而不是在其外部分配serviceA中的金额。

.controller('ProjectListCtrl', function ($scope, serviceA, Projects) {
    var projectList = this;
    projectList.projects = Projects;
    projectList.total = function () {
        var total = 0;

        angular.forEach(projectList.projects, function (project) {
            total += project.type.cost;
            serviceA.set(total);
        });

        //return total; //want to use this total in other controller
    };
})

此外,serviceA是一项服务,因此您可以像对象一样使用它,而不是将其分配给变量

.controller('PaymentFormCtrl',
    function ($scope, $http, serviceA) {
    var total = serviceA.get();
    console.log(total);

});