Role Based Component

[lemontreess]

``

I'm submitting a...

Current behavior

Hi Alex,

I am happy to use your library in project! Could you help me please with one question?

<myComponent  *ngxPermissionsOnly="'ADMIN'; authorisedStrategy: disabledFunc; unauthorisedStrategy: enableFunc">
         </myComponent>

 public disabledFunc(templateRef: TemplateRef<any>) {
            // I want the button in the component to disable. What should I do？
        }

@Component({
 selector: 'myComponent',
template: `
        <h2>{{title}}</h2>
        <button> <div>123</div></button>
`} 

I want the button in the component to disable. What should I do？

[AlexKhymenko]

Hi @lemontreess check out this guide https://github.com/AlexKhymenko/ngx-permissions/wiki/common-use-cases#disable-element

[lemontreess]

But the button is in the component。

I want to make the button disable in the component。

[AlexKhymenko]

I understand Do you consider doing like this

@Component({
 selector: 'myComponent',
template: `
        <h2>{{title}}</h2>
        <button *ngxPermissions="permissions" authorisedStrategy: disabledFunc; unauthorisedStrategy: enableFunc"> <div>123</div></button>
`} 

And then just pass permissions to component via input

<myComponent  [permissions]="['ADMIN']">
         </myComponent>

[lemontreess]

But if this component is already packaged

[AlexKhymenko]

Sorry i can't write code right now. But preudo code will be find button in templateRef and then disable it.

[lemontreess]

Thank you for your answer。Although I still don't understand

[AlexKhymenko]

@lemontreess Sorry i have like no time at all ... as soon as i will have some time i will help You.

[cubet-rahul]

@AlexKhymenko I have three roles: ADMIN, MANAGER, and USER. Each roles has a set of permissions. So I am setting three roles with their permissions like below and I want to display the link only if the ADMIN or MANAGER logged in. How can I implement that in angular 6?
NgxRolesService .addRoles({ 'USER': ['canReadInvoices'], 'ADMIN': ['canReadInvoices', 'canEditInvoices', 'canUploadImages'], 'MANAGER': ['canEditInvoices'], }); <a *ngxPermissionsOnly="['canEditInvoices']" href="#" data-toggle="modal" (click)="edit(id)">Edit

I cannot see any example which shows how set permission based on a role. Please help.

[sezer]

@AlexKhymenko I have three roles: ADMIN, MANAGER, and USER. Each roles has a set of permissions. So I am setting three roles with their permissions like below and I want to display the link only if the ADMIN or MANAGER logged in. How can I implement that in angular 6? NgxRolesService .addRoles({ 'USER': ['canReadInvoices'], 'ADMIN': ['canReadInvoices', 'canEditInvoices', 'canUploadImages'], 'MANAGER': ['canEditInvoices'], }); <a *ngxPermissionsOnly="['canEditInvoices']" href="#" data-toggle="modal" (click)="edit(id)">Edit

I cannot see any example which shows how set permission based on a role. Please help.

@cubet-rahul Do you have any progress on this? I'm trying same thing but I can only use roles for authentication. Permissions seems useless or I couldn't use it properly.

[yd021976]

Hi, if I can help :

• If you use "roles", then use in your template the role name to check permissions e.g, according to the @cubet-rahul code sample: <a *ngxPermissionsOnly="['ADMIN']" href="#" data-toggle="modal"></a> This will allow "ADMIN" role only, but all permissions of ADMIN role

• If you use "permissions", then use "permission name" in your template e.g, according to the @cubet-rahul code sample: <a *ngxPermissionsOnly="['canEditInvoices']" href="#" data-toggle="modal"></a> this will allow users that have "canEditInvoices", no matter of their roles

In addition, if this doesn't fit your needs, you can provide a validation function when defining role and/or permission. Example: NgxRolesService.addRole('ADMIN",()=>{ check whatever you want and return boolean })

Hope it helps

[sezer]

@yd021976 thank you, its working now :). I was confused about loading/adding permissions. ISSUE #80 is the key point.

[GitHubish]

The latest version (8.1.0) released a few days ago adds this possibility, doesn't it? Roles seem to be fully supported? I haven't been able to test or look at it in detail yet.

https://github.com/AlexKhymenko/ngx-permissions/releases/tag/v8.1.0

[AlexKhymenko]

@GitHubish use the latest version 8.1.1