CODEWITHSUNDEEP
angularjsjsonjwtangular5auth0
Mark Shanahan ッ
Mark Shanahan ッ

Reputation: 17

Auth0/Angular2-Jwt not working with Angular 5

Angular2-JWT has a particular function I need to use in order to Show/Hide links based on the logged user token being stored in localStorage.

tokenNotExpired();

I have been looking for alternative ways on implementing the conditional statements showing nav-links IF token is in localStorage but doesn't seem to work.

 import { Injectable } from '@angular/core';
 import {Http, Headers} from '@angular/http';
 import 'rxjs/add/operator/map'
 import { BehaviorSubject } from 'rxjs/BehaviorSubject';
 import { HttpClientModule } from '@angular/common/http';
 import { CanActivate} from '@angular/router';
 import {FlashMessagesModule} from 'angular2-flash-messages';
 import { JwtModule } from '@auth0/angular-jwt';
 @Injectable()
 export class AuthService{
   authToken:null;
   user:any;
    isLoggedin: boolean = false;
   constructor(private http:Http) { }



   isLoggedIn() {
     if (localStorage.getItem("id_token") == null) {
         this.isLoggedin = false;
         console.log(this.isLoggedIn);
         return this.isLoggedin;
     }
     else {
       console.log(this.isLoggedIn);
         return true;
     }
   }

I can't seem to figure why it doesn't work correctly. Maybe I am missing something.

<ul class="nav-l" NgClass="{'invisible':isLoggedIn()===true}">
  <li class="nav-link" NgIf="isLoggedIn()"  [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}"><a [routerLink]="'/home'">Home</a></li>
  <li class="nav-link" NgIf="isLoggedIn()" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}"><a [routerLink]="'/about'">About</a></li>
  <li class="nav-link" NgIf="isLoggedIn()" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}"><a [routerLink]="'/feature'">Features</a></li>
  <li class="nav-link" NgIf="isLoggedIn()" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}"><a [routerLink]="'/contact'">Contact</a></li>

In the HTML above I have tried two different methods of hiding them (NgClass condition & NgIf condition).

Upvotes: 1

Views: 929

Answers (1)

tolotra
tolotra

Reputation: 3270

The important point is to know which schema changes frequently, eg. user, company or project...

If a schema does not change frequently, you can embed it in its parent schema but embedding data too hard to manipulate, otherwise you can embed its ids in a new field.

You can use child referencing if your UserSchema change frequently.

const CompanySchema = mongoose.Schema({
    name: {
        type: String
    },
    ....
    userIds: [1, 2, 3]
})

Or parent referencing if your CompanySchema change frequently.

const UserSchema = mongoose.Schema({
    name: {
        type: String
    },
    ....
    companyId: 1
})

In this one, companyId can be null.

I hope this helped.

Upvotes: 2

Related Questions