根据angularjs中的角色显示html页面

时间:2016-01-18 05:24:47

标签: angularjs

在我的控制器中,我有以下代码:

$scope.roleId = localStorage.getItem("Role ID");

在我的应用程序中我有2个HTML页面,我将角色ID存储在本地存储中,基于角色ID我必须显示HTML页面的任何解决方案这个roleId将基于以下内容进行更改登录用户

我可以尝试在我的控制器中使用if else条件,如下所示,我没有得到如何实现这个

if ($scope.roleId==2) {

}

1 个答案:

答案 0 :(得分:0)

首先,你必须根据角色id创建状态,我使用一些虚拟数据来举例 -

angular.module('myApp').config(['$stateProvider', '$urlRouterProvider', '$locationProvider', '$httpProvider', function ($stateProvider, $urlRouterProvider, $locationProvider, $httpProvider) {

        $urlRouterProvider
                .otherwise('/');
        $stateProvider
                .state('role_1', {
                    url: '/role_1',
                    templateUrl: 'role_1.html',
                    controller: 'userCtrl'
                })
                .state('role_2', {
                    url: '/role_2',
                    templateUrl: 'role_2.html',
                    controller: 'userCtrl'
                })
                .state('access_denied', {
                    url: '/access_denied',
                    templateUrl: '403.html'
                })
        $locationProvider.html5Mode(false);
    }]);

现在这些状态将根据用户角色ID进行路由。

我们必须在.run方法中编写代码,如下所示 -

angular.module('myApp').run(function ($rootScope, $location, $state, $window, localStorageService, $cookies) {
    $rootScope.$on("$stateChangeStart", function (event, toState, toParams, fromState, fromParams) {
        var roleId = localStorageService.get('roleId');

        if (roleId !== undefined && roleId == 1) {
            $location.url("/role_1");
        } else if (roleId !== undefined && roleId == 2) {
            $location.url("/role_2");
        } else {
            $location.url("/access_denied");
        }


    });
});

我认为它会解决您的问题,请相应更新您的代码

由于