ngx-security/permissions

This module provides a way to manage permissions in your Angular application using structural directives and pipes. Default permissions are provided by the SubjectService from @ngx-security/core, which is used to manage user details and authorities.

Installation

npm install --save @ngx-security/core @ngx-security/permissions

Setup

SubjectPermissionsProvider is provided using the provideSecurityPermissions helper function, which most apps include in the application providers in app.config.ts.

export const appConfig: ApplicationConfig = {
  providers: [
    provideSecurityCore(),
    provideSecurityPermissions()
  ]
};

Now you are ready to use it. See SecurityCoreModule for SubjectService implementation which provide authorities as permissions.

Usage

Structural directives

<p *isPermitted="'printer:xpc4000:*'">This should see users with printer:xpc4000:*</p>

Pipes

<p *ngIf="'printer:xpc4000:*' | isPermitted">This should see users with printer:xpc4000:*</p>

Pipes with poetry

<p *ngIf="'user' | isPermitted:'printer:xpc4000:*'">This should see users with printer:xpc4000:*</p>`

Advance setup

Implement custom SubjectPermissionsProvider class:

import { Injectable, OnDestroy } from '@angular/core';
import { BehaviorSubject, Observable } from 'rxjs';
import { SubjectPermissionsProvider } from '@ngx-security/permissions';

@Injectable()
export class MyPermissionsProvider extends SubjectPermissionsProvider implements OnDestroy {

  private permissions: BehaviorSubject<string[]> = new BehaviorSubject(['printer:xpc5000:print', 'printer:xpc4000:*', 'nas:timeCapsule,fritzbox:read']);

  permissions$: Observable<string[]> = this.permissions.asObservable();

  constructor() {
    super();
  }

  ngOnDestroy(): void {
    this.permissions.complete();
  }

  getPermissions(): string[] {
    return this.permissions.getValue();
  }
}

Add provider for core and permissions module in your app.config.ts and set your custom provider:

export const appConfig: ApplicationConfig = {
  providers: [
    provideSecurityCore(),
    provideSecurityPermissions({
      subjectPermissions: {provide: SubjectPermissionsProvider, useClass: MyPermissionsProvider}
    })
  ]
};