Getting errors while building the angular application

Question

I am getting some compilation error while building the angular project and the error is given below.

Error:

list.component.html(155,47): Property 'auth' is private and only accessible within class 'ListComponent'.

I am explaining my code below.

<td mat-cell *matCellDef="let element; let i = index;">
    <mat-icon *ngIf="auth.currentUserValue.RoleName === 'admin'" (click)="editStore(element)" class="text-primary"
        style="cursor: pointer">edit</mat-icon>
    &nbsp;
    <mat-icon *ngIf="auth.currentUserValue.RoleName === 'admin'" (click)="deleteStore(element)" class="text-danger"
        style="cursor: pointer">delete_forever
    </mat-icon>
</td>

import { AuthenticationService } from 'src/app/_services';
constructor(private auth : AuthenticationService) {}

I need to clear this error.

C.OG · Accepted Answer · 2019-12-26 08:36:36Z

The AuthenticationService is marked as private. This means that it cannot be accessed outside of its containing class. Which is the component and not the template.

Solution 1

Mark the AuthenticationService as public.

constructor(public auth : AuthenticationService) {}

This will allow your template to have access to it.

Solution 2

It's advised against to access your services or properties on your services directly from the template. Create a reference on the component instead.

import { AuthenticationService } from 'src/app/_services';

@Component({})
export class MyComponent {
  currentUserRoleName = this.auth.currentUserValue.RoleName;
  constructor(private auth : AuthenticationService) {}
}

Your template:

<td mat-cell *matCellDef="let element; let i = index;">
    <mat-icon *ngIf="currentUserRoleName === 'admin'" (click)="editStore(element)" class="text-primary"
        style="cursor: pointer">
        edit</mat-icon>
    &nbsp;
    <mat-icon *ngIf="currentUserRoleName === 'admin'" (click)="deleteStore(element)" class="text-danger"
        style="cursor: pointer">delete_forever
    </mat-icon>
</td>

Collectives™ on Stack Overflow

Getting errors while building the angular application

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related