23

具有 3rd 方库回调函数的服务：

mbAppModule.service('aService', function ($http) {
    this.data={"somedata":0};
    var m3rdPartLib="init";  // init    
    m3rdPartLib.on('timeupdate', function() {
        this.data.somedata=1;
    });
}

和一个控制器

mbAppModule.controller({
    MController: function ($scope, $http, mService) {
        $scope.mService= mService;    
    });
});

html页面

{{mService.data.somedata}}

问题 ：

m3rdPartLib.on() 是我在服务中使用的第 3 方库回调函数。我想在 ui 中显示它，因为它正在更新。在回调时，值会发生变化，但不会反映在 ui 上。

阅读一些文档，发现可以调用 $rootScope.$apply，但我在服务中没有 $scope / $rootScope 的引用。

4

4 回答 4

30

您可以在您的服务中依赖$rootScope并调用 apply。

mbAppModule.service('aService', ["$http", "$rootScope", function ($http, $rootScope) {
    this.data = {
        "somedata": 0
    };
    var m3rdPartLib = "init"; // init    
    m3rdPartLib.on('timeupdate', function () {
        $rootScope.$apply(function(){
            this.data.somedata = 1;
        });
    });
}]);
于 2013-09-21T11:35:15.847 回答
3

我需要从服务中更新输入字段，因为它有侦听器，并且没有随机动态地更改数据。

这也可以用于调用控制器中的作用域函数：

//scope will be set to current scope of a controller
//which has an ng-view containing this element    
var scope = angular.element('#input-element').scope();
//wrap changes in an apply call to make sure view and model are consistent
scope.$apply(function() {
    scope.object.data = value;
});

感谢这篇文章：如何使用 AngularJS 访问浏览器控制台中的 $scope 变量？

于 2014-01-29T20:58:50.360 回答
0

使用$scope.$watch功能。看看我的jsfiddle。我没有你的库，所以我只模拟它 - 5 秒后值从 0 变为 1。

于 2013-09-21T11:10:53.150 回答
0

如果您在服务中使用范围，那么这是一个很好的指标，表明您正在破坏 SRP，因为您的服务应该只将数据检索到您的控制器。我的建议是你可以做这样的事情。

mbAppModule.service('aService', ["$http", "$rootScope", function ($http, $rootScope) {
  this.data = {
    "somedata": 0
  };
  var m3rdPartLib = "init"; // init    
  this.GetPartLib = function () { 
    return m3rdPartLib;
  }
}]);

mbAppModule.controller({
  MController: function ($scope, $http, mService) {
  this.GetPartLib = function (){ 
    mService.on('timeupdate', function() {
     this.data.somedata=1;
    });
  }
});
于 2016-02-25T02:48:45.067 回答