enable-for-role.directive.ts

import {Directive, Input, TemplateRef, ViewContainerRef} from '@angular/core';

@Directive({
    selector: '[enableForRole]',
})
export class EnableForRoleDirective {
    
    constructor(
        private viewContainerRef: ViewContainerRef,
        private templateRef: TemplateRef<any>
    ) {}
    
    // the role the user must have
    @Input() set enableForRole(role: string) {
        let userObj = JSON.parse(localStorage.getItem('user'));
        
            if (userObj.role == role)) {
                // If user has role, show element
                this.viewContainerRef.createEmbeddedView(this.templateRef);
            } else {
                // Else clear element
                this.viewContainerRef.clear();
            }
    }
    
}