Olá pessoal, boa tarde! Acumulei 3 problemas para postar de uma só vez kkk
O primeiro é que no meu header não exibe a mensagem 'Please, login!' quando o usuário não está logado. Quando logado, tudo ok!
<header class="fixed-top">
<nav class="navbar navbar-light bg-white">
<a class="navbar-brand">SERMIL TESTE</a>
<div *ngIf= "(user$ | async) as user; else login">
<i class="fa fa-user-circle"></i>
<a class= "username"> {{user.name}}</a>
</div>
<ng-template #login>
<span class="navbar-text">
Please, login!
</span>
</ng-template>
</nav>
</header>
Esse é o meu user.service.ts, que por sinal estão 2 dos problemas. Primeiro que o BehaviorSubject não aceita valor (null) e segundo que a const 'token' não é aceita no jwt_decode sem o uso do any:
import { TokenService } from './../login/login/token/token.service';
import { Injectable } from "@angular/core";
import { BehaviorSubject } from 'rxjs';
import { User } from './user';
import jwt_decode from "jwt-decode";
@Injectable ({providedIn: 'root'})
export class UserService {
private userSubject = new BehaviorSubject<User>({id:null, name:null, email:null, profile:null});
constructor (
private tokenService: TokenService)
{
this.tokenService.hasToken() &&
this.decodeAndNotiFy();
}
setToken(token: string){
this.tokenService.setToken(token);
this.decodeAndNotiFy();
}
getUser (){
return this.userSubject.asObservable();
}
private decodeAndNotiFy(){
const token: any = this.tokenService.getToken();
const user = jwt_decode(token) as User;
this.userSubject.next(user);
}
}
Esse foi o erro para o jwt_decode(token) as User:
const token: string | null
Argument of type 'string | null' is not assignable to parameter of type 'string'.
Type 'null' is not assignable to type 'string'.ts(2345)
Esse foi a maneira como meu token foi recuperado:
loginUser(): void {
this.serviceService.loggingIn(this.service).subscribe(data => {
this.serviceService.showMessage('Usuário autenticado!')
const authToken = JSON.parse(JSON.stringify(data)).token
console.info(authToken)
this.userService.setToken(authToken)
}, error => {
this.service.password = ''
if (error.status == 400){
this.serviceService.showMessage(error.error[0].error)
}
})
}
logout(): void {
localStorage.clear();
this.router.navigate(['']);
}
}
O código não é o mesmo do apresentado no curso pq meu projeto já estava um pouco adiantado. O problema principal tá no header.component.html que não mostra a mensagem de ' Please, login!'
Grato desde já!