angular - 按用户角色添加对菜单项的权限

Question

我希望能够根据角色显示我应该看到哪些元素，我遵循这个：https ://github.com/akveo/nebular/issues/274 ，但它对我不起作用，目前它隐藏两个角色的菜单

我希望用户角色有权访问仪表板

app.module.ts

NbSecurityModule.forRoot({
      accessControl: {
          user: {
          view: ['dashboard']
        },
        admin: {
          view: ['*']
        }
      }
    })

页面菜单.ts

{
        title: 'Main',
        link: '/pages/dashboard',
        home: true,
        children: undefined,
        data: {
          permission: 'view',
          resource: 'dashboard'
        }
      },

Answer 1

为您找到了一些有用的链接，希望对您有所帮助：

https://github.com/akveo/ngx-admin/issues/1160

https://github.com/akveo/ngx-admin/issues/1779

Answer 2

基于角色的视图可以在Pages.components.ts中设置

1. 从身份验证服务获取用户角色

2. 根据用户角色将hidden的值设置为 true 或 false

export class PagesComponent  implements OnInit{

  currentUser: any;
  menu: NbMenuItem[]

  constructor(private AuthService: AuthenticationService) {
    this.currentUser = AuthService.currentUserValue;
   
}
ngOnInit(){

  this.menu = [
    {
       title: 'Main',
        link: '/pages/dashboard',
        home: true,
        children: undefined,
        data: {
          permission: 'view',
          resource: 'dashboard'
        },
      "hidden" : this.currentUser.roles[0]!='ROLE_ADMIN'? true:false

    }
}