angularjs 权限控制显示办法

在项目中遇到根据用户不同的角色显示不同内容的需求

下面是我自己想的一种解决办法

一、定义用户角色

/*
 * 用户角色 service
 * */
angular.module('hkApp').factory('roleService', function($http, API_ENDPOINT, $q, $log) {
    
	var roleServiceObj = {};

	//当前角色
	var currentRole;
	//数据字典,数据对应的角色
	var roleNameData = {
			2:"门店",
			3:"创客",
			5:"创客",//普通用户
			6:"分公司"
	};
	
	//设置当前角色
	function setCurrentRole(currentRoleValue){
		currentRole = currentRoleValue;
	}
	//得到当前角色
	function getCurrentRole(currentRoleValue){
		return currentRole;
	}
	
	//得到当前角色名字
	function getCurrentRoleName(roleKey){
		return roleNameData[roleKey];
	}
	
	//得到角色数据字典
	function getRoleNameData(){
		return roleNameData;
	}
	
	//是否是会员
	function isMember(){
		if(currentRole==3 || currentRole == "3" || currentRole==5 || currentRole == "5"){
			return true;
		}
		return false;
	}
	
	//是否是公司
	function isCompany(){
		if(currentRole==6 || currentRole == "6"){
			return true;
		}
		return false;
	}
	
	//是否是店铺
	function isShop(){
		if(currentRole==2 || currentRole == "2"){
			return true;
		}
		return false;
	}
	
	roleServiceObj = {
		"setCurrentRole" : setCurrentRole,
		"getCurrentRole" : getCurrentRole,
		"getCurrentRoleName" : getCurrentRoleName,
		"isMember" : isMember,
		"isCompany" : isCompany,
		"isShop" : isShop,
		"getRoleNameData" : getRoleNameData
	};
	
    return roleServiceObj;

});

二、配置路由

$stateProvider
	//app的首页
	.state('index',{
		url:'/app_index',
		template: '<div class="" ng-if="isMember">会员名称:注册创客</div>',
		onEnter :function(){
			//因此底部的导航栏
			$(".index_footer").show();
		},
		controller:["$scope","$state","ApiService","roleService",function($scope,$state,ApiService,roleService){

			var userInfoPromise = ApiService.post("{:U('UserInfo/getUser')}",{
				"id": "{$Think.session.ADMINID}"
			});

			userInfoPromise.then(function(response){
				if(response.status == 1){
					//会员名称
					$scope.username = response.data.name;
					//会员类型
					$scope.typetext = response.data.typetext;
					//积分
					$scope.jifen = response.data.jifen;
					//红包
					$scope.redpacket = response.data.redpacket;
					//缓存记录用户的角色
					roleService.setCurrentRole(response.data.type);

					//是否是会员
					$scope.isMember = roleService.isMember();
					//是否是公司
					$scope.isCompany = roleService.isCompany();
					//是否是店铺
					$scope.isShop = roleService.isShop();
				}
			});

		}]
	})

猜你喜欢

转载自hbiao68.iteye.com/blog/2305829