如何做:AngularJS服务或其他组件在模块加载时实例化

How-to: AngularJS Service or other component instantitate when module loads?

本文关键字：模块 加载 实例化 组件 其他 何做 AngularJS 服务      更新时间：2023-09-26

读者好，Angularistics，

我想知道如何创建一个服务、提供商或任何其他angular组件，当模块加载时，它会立即实例化一次。

。我有一个模块叫做'utils'我有一个应用模块叫做'myApp'这取决于'utils'

我在utils模块中有一个名为'intervalRegister'的服务，其中包含一个用于应用范围api轮询的注册方法。

当我们想要注册一个轮询时，我们必须每次都使用这个服务，但是当窗口失去焦点时，这个服务会智能地停止所有轮询，以避免不必要的网络流量。

目前这个'intervalRegister'是通过'utils'模块的运行方法实例化的，但我不认为这是最好的解决方案。

我认为将它添加到run方法中是可以的，但作为替代，您可以添加一个使用interval服务的控制器。

这可能更好，因为您还可以在该控制器中添加轮询相关逻辑。

我不知道其他自动开始间隔的方法，我也没有在谷歌上看到过。

请看看下面的演示或在这个文件。

angular.module('demoApp', ['utils'])
	.controller('pollController', PollController)
	.controller('mainController', MainController);
angular.module('utils', [])
    //.run(['intervalTimer', function(intervalTimer){}])
	.service('intervalTimer', IntervalTimer)
	
function IntervalTimer($interval, $log) {
    var self = this;
    this.count = 0;
    this.pollCallbacks = [];
    this.addPoll = function(callback, scope) {
        return self.pollCallbacks.push({
            fn: callback,
            scope: scope
        });
    };
    this.timer = function() {
        self.count++;
        $log.log('hello from interval timer', self.count);
        if (self.pollCallbacks.length > 0 ){
            angular.forEach(self.pollCallbacks, function(callbackObj) {
                //console.log(callbackObj.scope);
                callbackObj.fn.call(callbackObj.scope);
            });
        }
    };
    $interval(this.timer, 1000);
}
function MainController() {
	
}
function PollController(intervalTimer, $log) {
    var vm = this;
    this.messages = '';
    this.pollCounter = 0;
    this.addPolling = function() {
        var callbackObj = {
            pollCounter: angular.copy(vm.pollCounter++),
            fn: function() {
                var msg = 'poll callback no. ' + this.pollCounter + ' called!' 
    			$log.log('poll callback no. ' + this.pollCounter + ' called!');
                vm.messages += 'poll callback no. ' 
                    + this.pollCounter + ' called!' + ''r'n';
   			}
        };
        
    	vm.pollCounter = intervalTimer.addPoll(callbackObj.fn, callbackObj);
    };
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="demoApp" ng-controller="mainController as mainCtrl">
    <div ng-controller="pollController as pollCtrl">
        <button ng-click="pollCtrl.addPolling()">add poll</button>active polls: {{pollCtrl.pollCounter}} <pre ng-bind="pollCtrl.messages"></pre>
    </div>
</div>

相关文章：