Angular开发者指南(五)服务
服务
AngularJS提供了几个有用的服务(如$http),但对于大多数应用程序,你也想创建自己的。像其他核心的AngularJS标识符一样,内置服务总是以$开头(例如$http)。
<div id="simple" ng-controller="MyController" ng-app="myServiceModule"> <p>让我们尝试这个简单的通知服务,注入到控制器</p> <input ng-init="message='test'" ng-model="message" > <button ng-click="callNotify(message);">NOTIFY</button> <p>(必须点击3次才能看到提醒)</p> </div>
angular. module('myServiceModule',[]). controller('MyController',['$scope','notify',function($scope,notify) { $scope.callNotify = function(msg) { notify(msg); }; }]). factory('notify',['$window',function(win) { var msgs = []; return function(msg) { msgs.push(msg); if (msgs.length === 3) { win.alert(msgs.join('n')); msgs = []; } }; }]);
it('should test service',function() { expect(element(by.id('simple')).element(by.model('message')).getAttribute('value')) .toEqual('test'); }); 需要点击三次NOTIFY按钮才会出现弹出框内容 var myModule = angular.module('myModule',[]); myModule.factory('serviceId',function() { var shinyNewServiceInstance; // 构造shinyNewServiceInstance的工厂函数体 return shinyNewServiceInstance; }); 此时不是注册服务实例,而是一个在调用时将创建此实例的工厂函数。 var batchModule = angular.module('batchModule',[]); /** *`batchLog'服务允许消息在内存中排队,并且每50秒刷新到console.log */ batchModule.factory('batchLog',['$interval','$log',function($interval,$log) { var messageQueue = []; function log() { if (messageQueue.length) { $log.log('batchLog messages: ',messageQueue); messageQueue = []; } } // 开始定期检查 $interval(log,50000); return function(message) { messageQueue.push(message); } }]); /** *`routeTemplateMonitor`监视每个`$ route`更改,并通过`batchLog`服务记录当前模板 */ batchModule.factory('routeTemplateMonitor',['$route','batchLog','$rootScope',function($route,batchLog,$rootScope) { return { startMonitoring: function() { $rootScope.$on('$routeChangeSuccess',function() { batchLog($route.current ? $route.current.template : null); }); } }; }]); 在示例中,需要注意的是:
还可以通过模块的配置函数中的$provide服务注册服务: angular.module('myModule',[]).config(['$provide',function($provide) { $provide.factory('serviceId',function() { var shinyNewServiceInstance; // 构造shinyNewServiceInstance的工厂函数体 return shinyNewServiceInstance; }); }]); 这种技术通常用于单元测试中来模拟服务的依赖。 var mock,notify; beforeEach(module('myServiceModule')); beforeEach(function() { mock = {alert: jasmine.createSpy()}; module(function($provide) { $provide.value('$window',mock); }); inject(function($injector) { notify = $injector.get('notify'); }); }); it('should not alert first two notifications',function() { notify('one'); notify('two'); expect(mock.alert).not.toHaveBeenCalled(); }); it('should alert all after third notification',function() { notify('one'); notify('two'); notify('three'); expect(mock.alert).toHaveBeenCalledWith("onentwonthree"); }); it('should clear messages after alert',function() { notify('one'); notify('two'); notify('third'); notify('more'); notify('two'); notify('third'); expect(mock.alert.calls.count()).toEqual(2); expect(mock.alert.calls.mostRecent().args). toEqual(["morentwonthird"]); }); (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |