如何在角度2中管理角色和权限

本文介绍了如何在角度2中管理角色和权限的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我已经存储了以下数据

"permission": { "1000": "CREATE_DISBMT_WORKFLOW", "1001": "EDIT_DISBMT_WORKFLOW", "1002": "EDIT_UPLOAD_PHOTO_DISBMT_WORKFLOW", "1003": "EDIT_UPLOAD_CONFIRMED_DISBMT_WORKFLOW", "1004": "EDIT_VERIFIED_DISBMT_WORKFLOW", "1005": "VIEW_DISBMT_WORKFLOW", "1006": "DELETE_DISBMT_WORKFLOW" }

现在我要在本地存储中创建一个函数，如果上面的权限对象中存在该函数，则将在上面传递CREATE_DISBMT_WORKFLOW，该函数应该返回true，否则返回false

in local storage now I want to create a function on which I will pass CREATE_DISBMT_WORKFLOW if it's there in above permission object that it should return true else false

在角度2中执行此操作的方法是

what is the way to do that in angular 2

我的逻辑是，如果返回真数据，将使用* ngIf等显示.

here my logic is if it returns true data will display using *ngIf etc.

推荐答案

要管理angular2应用程序的权限和访问控制，可以使用 ng2权限模块.

For manage permissions and access control for your angular2 applications, you can use ng2-permission module.

将Ng2Permission导入到您应用的模块中:

Import Ng2Permission into your app's modules:

import { Ng2Permission } from 'angular2-permission'; @NgModule({ imports: [ Ng2Permission ] })

您还可以使用PermissionService管理权限.请参阅以下链接:管理权限.

You can also manage permissions with PermissionService. see this link: Managing permissions.

import { PermissionService } from 'angular2-permission'; //. //. //. constructor(private _permissionService: PermissionService) { this._permissionService.define(['CREATE_DISBMT_WORKFLOW', 'EDIT_DISBMT_WORKFLOW', 'EDIT_UPLOAD_PHOTO_DISBMT_WORKFLOW', 'EDIT_UPLOAD_CONFIRMED_DISBMT_WORKFLOW', 'EDIT_VERIFIED_DISBMT_WORKFLOW', 'VIEW_DISBMT_WORKFLOW', 'DELETE_DISBMT_WORKFLOW']); }

此模块还包含两个指令，用于控制视图中的访问. 例如，如果已经定义DELETE_DISBMT_WORKFLOW或将其添加到权限存储中，则将显示删除"按钮.

This module also contains two directive for controlling access in views. For example, the delete button will displayed, if DELETE_DISBMT_WORKFLOW already defined or add in permission store.

<button type="button" class="btn btn-danger btn-xs" [hasPermission]="['DELETE_DISBMT_WORKFLOW']"> <span class="glyphicon glyphicon-trash" aria-hidden="true"></span> Delete </button>

您可以从Ng2Permission模块使用PermissionGuard，以保护路由.

You can use PermissionGuard from Ng2Permission module, protecting routes.

import { PermissionGuard, IPermissionGuardModel } from 'angular2-permission'; const routes: Routes = [ { path: 'users', component: UserListComponent, canActivate: [PermissionGuard], data: { Permission: { Only: ['GuestUser'], RedirectTo: '403' } as IPermissionGuardModel }, children: [] }, //. //. //.