angularjs service全局保存数据的误区

╰+攻爆jí腚メ 2022-07-15 14:55 56阅读 0赞

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

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

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

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

(function(angular){
    	angular.module('app.login')
    	.factory('userService',function($http){
    		return {
    			http:$http,
    			token:'',
    			auth:[],
    			loginname:'',
    			login:function(loginname,password,fn){
    				this.http({
    					url:'../../scripts/loginModule/services/loginOKTest.js',
    					method:'GET'
    					})
    					//data,header,config,status
    					.success(Base.bindArguments(this,function(){
    						var data=arguments[0][0];
    						if(data[0].success){
    							this.token=data[0].token;
    							this.auth=data[0].auth;
    							Cookies.setCookieValue("loginname",this.loginname,60*60*1000);
    							Cookies.setCookieValue("token",this.token,60*60*1000);
    							fn(data[0]);
    						}
    					}))
    					.error(function(data,header,config,status){
    						alert("验证服务请求失败！");
    				 });
    			},
    			getToken:function(){
    				return this.token;
    			},
    			getLoginname:function(){
    				return this.loginname;
    			},
    			getAuth:function(){
    				return this.auth;
    			},
    			loginout:function(){
    				this.token='';
    				this.loginname='';
    				this.auth=[];
    				Cookies.delCookieValue("token");
    				Cookies.delCookieValue("loginname");
    			}
    		};
    	});
    })(window.angular);

我们在这里设置了token和auth成员变量  
  
这里的Base.bindArguments保证了回调中的this为该服务

Base.bindArguments=function(context,fn){
    	return function(){
    		return fn.call(context,arguments);
    	};	
    };

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

(function(angular){
    	
        if(!app)
        	app={};
        if(!app.main)
    		app.main=angular.module('app.main', []);
        app.main.controller('MenuController',function($scope,menuService,userService){
        	var loginname=Cookies.getCookieValue("loginname");
        	var token=Cookies.getCookieValue("token");
    	Cookies.delCookieValue("token");
    	Cookies.delCookieValue("loginname");
        	$scope.menu=[];
        	
        	menuService.initMenu(loginname,token,function(menu){
        		$scope.menu=menu;
        		$scope.$broadcast("menuLoaded");
        	});
        	
    		$scope.displaySwitch=function(index){
        		if($scope.menu[index].isShow)
        			$scope.menu[index].isShow=false;
        		else
        			$scope.menu[index].isShow=true;
        	};
        	
    	});
        
    })(window.angular);

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

发表评论取消回复

表情：

评论列表（有 0 条评论，56人围观）

还没有评论，来说两句吧...

相关阅读

相关 ThreadLocal保存全局用户信息

1.我这个此处，用于保存token，跟保存用户信息是一样的 > package com.example.demo.util; > > / >

左手的ㄟ右手/ 2023年10月12日 14:30/ 0 赞/ 104 阅读

相关 Angularjs中service与controller注入

相关项目:[AngularJsPractice][] 对于angularjs的MVC结构主要依赖注入。下文已controller以及service注入为例说明。代码中的s

Dear 丶/ 2022年08月03日 13:55/ 0 赞/ 189 阅读

相关 angularjs 设置全局变量的7种方法

在ng-app或控制器中定义的全局变量，在不同的controller里都可以使用。 1，通过var 直接定义global variable，这根纯js是一样的。 2，用an

忘是亡心i/ 2022年07月19日 02:28/ 0 赞/ 251 阅读

相关 angularjs service全局保存数据的误区

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

╰+攻爆jí腚メ/ 2022年07月15日 14:55/ 0 赞/ 57 阅读

相关 angularjs 手动加载以及误区

一、背景在一个页面内，如果要同时加载两个互不依赖的app，比如说通过include的方式加载其它页面。由于互不依赖你不可

た入场券/ 2022年07月15日 05:29/ 0 赞/ 250 阅读

相关 AngularJS 学习笔记 04：服务（services）

服务（services） $location 定时器（timeout 和 interval） $filter

Dear 丶/ 2022年05月26日 08:09/ 0 赞/ 246 阅读

相关 AngularJS中的factory、service以及provider的区别

初学 AngularJS 时，肯定会对其提供 factory 、 service 和 provider 感到疑惑，这三种都是提供服务的方式，他们到底有什么区别呢？

梦里梦外;/ 2022年05月22日 20:29/ 0 赞/ 227 阅读

相关 AngularJS 之 Factory vs Service vs Provider

　　当你初试 Angular 时，很自然地就会往 controller 和 scope 里堆满不必要的逻辑。一定要早点意识到，controller 这一层应该很薄；也就是说，应

青旅半醒/ 2022年04月06日 11:08/ 0 赞/ 259 阅读

相关 AngularJS(4)-服务(Service)

1.$location服务 $location 服务，它可以返回当前页面的 URL 地址 ![543426-20160918154240856-964781401.png][

阳光穿透心脏的1/2处/ 2021年12月15日 03:27/ 0 赞/ 284 阅读

相关 AngularJs 自定义service服务

service服务相当于本身已经构建了一个空白对象,通过this.来操作,不是通过this.创建的内容,需要提供一个this.方法来对外暴露返回

女爷i/ 2021年07月24日 12:33/ 0 赞/ 436 阅读