Angularjs 在控制器之间共享数据只能工作第一次



我正在尝试使用工厂在angularjs中的控制器之间共享数据。我已经遵循了类似问题的其他答案,但我只能让它第一次工作。我有一个具有 3 个状态的应用程序。其中一个州是一个简单的计算器。我希望计算器状态下的总计也以不同的状态显示。使用下面的代码,总计始终显示为 0。所以我认为它第一次有效,但在"总计"更改时不会更新。有人有什么建议吗??

.html:

<div class="list card">
  <div class="item item-divider">Total</div>
  <div class="item item-body">
    <div ng-model="figure">
      <b>{{figure}}</b> calories consumed today
    </div>
  </div>
</div> 

"家庭"控制器:

.controller('homeCtrl', function($scope, total) {
$scope.figure = total.get();
})

计算器控制器:

.controller('calcCtrl', function($scope, total) {
$scope.result = 0;
$scope.reset = function() {
    $scope.result = 0;
};
$scope.add = function(i) {
    if(!i){
    }else {
        $scope.result = $scope.result + parseInt(i);
        total.set($scope.result);
    }
};
});

.factory('total', function() {
var val = 0;
return {
get: function() {
    return val;
},
set: function(num) {
    val = parseInt(num);
    }
};  
})

如果使用对象来存储值,它会更好地工作。

var data = {val : 0};
return {
  get: function() {
    return data;
  },
  set: function(num) {
    data.val = parseInt(num);
  }
};  

或者你总是调用 get() 函数来获取最新值

.controller('homeCtrl', function($scope, total) {
   $scope.figure = total.get;
})

并在 HTML 中

<b>{{figure()}}</b>

最新更新