Angular 8 - 如何授权权限而不是具有 ngx-permissions 的角色？

Question

我在项目中使用 ngx-permissions (https://www.npmjs.com/package/ngx-permissions)，以便我可以管理用户对我的应用程序的权限。

据我所知，我们可以在 html 部分授权角色，但不能授权...

这是我们想要的：

Html:

<div *ngxPermissionsOnly="['voirResources']">1232465</div>

打字稿：

  ngOnInit() {
    const roleMetier: Role = new Role();
    roleMetier.nom = 'ADMIN';
    roleMetier.permissions = ['voirHighlightCard', 'voirResources', 'voirTout', 'voirNextSteps'];
    this.rolesService.addRole(roleMetier.nom, roleMetier.permissions);

    this.permissionsService.loadPermissions(['ADMIN']);
  }

如您所见，我为我的角色 Admin 设置了一些权限。之后，我为当前用户加载管理员权限。

在 Html 代码中，我添加了 *ngxPermissions="['voirResources']" 这样只有拥有 "voirResources" 权限的用户才能看到 div 内容。

这是 stackblitz 上的代码 => https://stackblitz.com/edit/angular-poc-ngx-permissions

我的问题是：

我们可以用 ngx-permissions 来做吗？
如果我们不能用 ngx-permissions 做到这一点，你知道我可以使用的另一个 npm 包吗？如果有很酷的东西可以使用，我不想开发另一个 ACL 包 ^^

感谢您的建议！

Answer 1

您需要使用 this.permissionsService.addPermission(['seeContent']); 或通过 loadPermission

所以修改你的 stackblitz：

ngOnInit() {
// this.chargerPermissionsUtilisateur();

this.chargerRoleUtilisateur();
console.log(this.rolesService.getRoles());
}

chargerRoleUtilisateur() {
    const roleMetier: Role = new Role();
    roleMetier.nom = 'ADMIN';
    roleMetier.permissions = ['seeContent'];

    this.permissionsService.addPermission(['seeContent']);

    this.rolesService.addRole(roleMetier.nom, roleMetier.permissions);
}

或者您可以将 chargerPermissionsUtilisateur() 方法更改为：

this.permissionsService.loadPermissions(['seeContent']);

并更改 ngOnInit

的顺序

this.chargerPermissionsUtilisateur();
this.chargerRoleUtilisateur();

https://stackblitz.com/edit/angular-poc-ngx-permissions-qxi4mz

Answer 2

使用 8.1.1 版可以在一行中完成

 this.rolesService.addRoleWithPermissions('ADMIN', ['seeContent']);

Angular 8 - 如何授权权限而不是具有 ngx-permissions 的角色？

Angular 8 - How to authorize permissions instead of roles with ngx-permissions?

acl

typescript

angular

angular8