Static member is not accessible error on navbar component

Question

I keep getting the following error: Static member is not accessible at this point:

auth.service.ts

export class AuthService {
  public static get isLoggedIn() {
    const user = JSON.parse(localStorage.getItem('user'));
    return (user !== null &&
      ((user.emailVerified === false && user.providerData[0].providerId === 'facebook.com') ||
        ((user.emailVerified !== false))));
  }
}

navbar.component.html

<nav *ngIf="!authService.isLoggedIn" class="navbar navbar-expand-lg navbar-dark" data-navbar="smart"></nav>

navbar.component.ts

@Component({
  selector: 'app-navbar',
  templateUrl: './navbar.component.html'
})
export class NavbarComponent implements OnInit {
  constructor(
    private authService: AuthService
  ) {}
}

How can I fix it?

why do you even need to have static method in service available via dependency injection? — Xesenix, Aug 16 '19 at 22:48
@Xesenix recently switched from Visual Studio Code to Webstorm, and I am trying to refactor it. — methuselah, Aug 16 '19 at 22:49
Possible duplicate of [How to bind static variable of component in HTML in angular 2?](https://stackoverflow.com/questions/39193538/how-to-bind-static-variable-of-component-in-html-in-angular-2) — dota2pro, Aug 16 '19 at 23:07

score 5 · Accepted Answer · answered Aug 16 '19 at 22:44

5

you don't need to inject AuthService,in the component just create a property to get the value from AuthService.isLoggedIn

export class NavbarComponent implements OnInit {

  constructor(){}

  get isLoggedIn () {
   return AuthService.isLoggedIn 
  }
}

template

<nav *ngIf="!isLoggedIn" class="navbar navbar-expand-lg navbar-dark" data-navbar="smart">
</nav>

answered Aug 16 '19 at 22:44

Muhammed Albarmavi

23,240
8
66
91

What is the difference between your way and `*ngIf="!isLoggedIn()"` `isLoggedIn () { return AuthService.isLoggedIn }` – dota2pro Aug 16 '19 at 23:08

Static member is not accessible error on navbar component

1 Answers1