AngularJS在控制器之间共享数据使用服务并观看更新

这里的任务很简单，但不清楚这个错误。AngularJS在控制器之间共享数据使用服务并观看更新

我的服务：

app.factory('Progress', function() { 

    var data = { 
     progressPercentageLoaded: 0 
    }; 

    return { 
     getProgress: function() { 
      return data.progressPercentageLoaded; 
     }, 
     setProgress: function (progress) { 
      data.progressPercentageLoaded = progress; 
     } 
    }; 
});

我有一个控制器是上传文件，这个设置进度值。

//in my controller 
$scope.progressPercentageLoaded = {progress:0}; 
//a few lines down 
function (evt) { 
console.log(evt); 
$scope.progressPercentageLoaded.progress = evt.loaded; 
Progress.setProgress($scope.progressPercentageLoaded.progress);

我的第二个控制器应该简单地监视更改的服务和更新的观点，但它保持停留在零即使我确认上传正在发生的事情，并且evt.loaded正在发生变化。

$scope.progress = 0; 
$scope.$watch(function() { return Progress.getProgress(); }, function (newValue, oldValue) { 
     if (newValue !== oldValue) { 
      $scope.progress = Math.min(100, parseInt(100 * newValue/$scope.size)); 
      if($scope.progress == 100) 
      { 
       $scope.progressModalInstance.close(); 
       window.location.reload(); 
      } 
     } 
    });

即，在$scope.progress第二控制器应与evt.loaded在第一控制器的值更新，但它没有。

在此先感谢您的任何指导。

编辑：我甚至增加了第三watch参数作为true但这并没有帮助。

编辑2：以上实际代码工作，据我所知，我相信别的东西是导致一个问题，当我恢复的代码上面的编辑它由于答案后，它突然像它应该那样工作。为此事道歉。使用$ rootScope。$广播将努力为这个

app.factory（ '进步'，功能较好

来源

2017-06-18 Summer Developer

您是否在控制台中看到任何错误？这些控制器是否相互继承？我用2个控制器创建了一个简单的例子，并且我看到观察者正在执行。但不是上传文件，我每2秒调用一次'setProgress'：'var p = 0; setInterval（function（）{$ scope。$ apply（function（）{Progress.setProgress（++ p）;}）;}，2000）;'这是否适合您？ –

@FrankModica上面的代码实际上工作，我不知道为什么它以前没有工作，但我只是恢复到上述，它的功能很好。我看到上传事件被记录，但上传百分比没有变化，可能上传太大了，即使上传的内容更多，它也没有变化？我不确定，但是我刚刚尝试了一些小文件，并且视图已经适当更新，没有对上述代码进行任何更改，很抱歉浪费您的时间！ :( –

没问题，很高兴它的工作:) –

（$ rootScope）{

var data = { 
    progressPercentageLoaded: 0 
}; 

    return { 
     getProgress: function() { 
      $rootScope.$broadcast('Event'); 
      return data.progressPercentageLoaded; 
     }, 
     setProgress: function (progress) { 
      data.progressPercentageLoaded = progress; 
     } 
    }; 
});

在你的第二个控制器，而不是使用观看东西像

$rootScope.$on('Event', function(){ 
    //your logic here 
})

来源

2017-06-18 23:52:36 Tik

如果可能，我宁愿坚持'watch'。 –

你失去的参考，因为你正在观看的Int值要更新每一次，因此你正在改变参考。你必须观看整个对象progressPercentageLoaded。

您必须通过作为$watch函数的最后一个参数，以便相等性检查为angular.equals。否则，只检查参考相等性。

来源

2017-06-19 00:49:30 mattias

对不起，我明白你在说什么，但没有在代码中做出这个改变......我只看着'Progress.getProgress（）;'，如果我只是返回对象而不是'data.progressPercentageLoaded ;'我仍然有同样的问题！ –

@SummerDeveloper我编辑了我的答案，看看。 – mattias

我有'真'作为最后一个参数，它仍然无法正常工作。 –

我不是100％确定，但Angular可能不知道文件上传事件。请致电$apply：

$scope.$apply(function() { 
    Progress.setProgress($scope.progressPercentageLoaded.progress); 
});

来源

2017-06-19 01:16:24

我曾经认为这是事实，并且之前尝试过，而现在，它并没有解决问题。 :( –

AngularJS在控制器之间共享数据使用服务并观看更新

回答

相关问题