angularjs service全局保存数据的误区

《angular权威指南》中有这么一句话“服务提供了一种能在应用的整个生命周期内保持数据的方法，它能够在控制器之间进行通信，并且能保证数据的一致性。”

         这里的【应用的整个生命周期】中的【应用】到底是什么？估计原文是【app】，然后就被翻译成了【应用】。【应用】是有歧义的，他可以有两个含义：1、指整个web应用，这样的话，他就类似于session了。第二个含义：【应用】指某个module，在这个module下面的为同一个实例。

          那么，到底是不是第一个含义呢？我们来试一下。

          上一篇文章中我将service理解为了可以提供类似session的东西，我们看一下代码：

          

[javascript]  view plain  copy

1. (function(angular){  
2.     angular.module('app.login')  
3.     .factory('userService',function($http){  
4.         return {  
5.             http:$http,  
6.             token:'',  
7.             auth:[],  
8.             loginname:'',  
9.             login:function(loginname,password,fn){  
10.                 this.http({  
11.                     url:'../../scripts/loginModule/services/loginOKTest.js',  
12.                     method:'GET'  
13.                     })  
14.                     //data,header,config,status  
15.                     .success(Base.bindArguments(this,function(){  
16.                         var data=arguments[0][0];  
17.                         if(data[0].success){  
18.                             this.token=data[0].token;  
19.                             this.auth=data[0].auth;  
20.                             Cookies.setCookieValue("loginname",this.loginname,60*60*1000);  
21.                             Cookies.setCookieValue("token",this.token,60*60*1000);  
22.                             fn(data[0]);  
23.                         }  
24.                     }))  
25.                     .error(function(data,header,config,status){  
26.                         alert("验证服务请求失败！");  
27.                  });  
28.             },  
29.             getToken:function(){  
30.                 return this.token;  
31.             },  
32.             getLoginname:function(){  
33.                 return this.loginname;  
34.             },  
35.             getAuth:function(){  
36.                 return this.auth;  
37.             },  
38.             loginout:function(){  
39.                 this.token='';  
40.                 this.loginname='';  
41.                 this.auth=[];  
42.                 Cookies.delCookieValue("token");  
43.                 Cookies.delCookieValue("loginname");  
44.             }  
45.         };  
46.     });  
47. })(window.angular);  

我们在这里设置了token和auth成员变量

这里的Base.bindArguments保证了回调中的this为该服务

[javascript]  view plain  copy

1. Base.bindArguments=function(context,fn){  
2.     return function(){  
3.         return fn.call(context,arguments);  
4.     };    
5. };  

然后，我们在另一个module中看看能不能取到token和auth

[javascript]  view plain  copy

1. (function(angular){  
2.       
3.     if(!app)  
4.         app={};  
5.     if(!app.main)  
6.         app.main=angular.module('app.main', []);  
7.     app.main.controller('MenuController',function($scope,menuService,userService){  
8.         var loginname=Cookies.getCookieValue("loginname");  
9.         var token=Cookies.getCookieValue("token");  
10.     Cookies.delCookieValue("token");  
11.     Cookies.delCookieValue("loginname");  
12.         $scope.menu=[];  
13.           
14.         menuService.initMenu(loginname,token,function(menu){  
15.             $scope.menu=menu;  
16.             $scope.$broadcast("menuLoaded");  
17.         });  
18.           
19.         $scope.displaySwitch=function(index){  
20.             if($scope.menu[index].isShow)  
21.                 $scope.menu[index].isShow=false;  
22.             else  
23.                 $scope.menu[index].isShow=true;  
24.         };  
25.           
26.     });  
27.       
28. })(window.angular);  

结果是这里的loginname和token是空的。说明这里依赖注入的userService和之前的userService已经不是同一个对象了。也就是这两个userService变量中的指针指向不同的堆内存