Skip to content

angular can not get user data form sessionstorage

sorry about my english. I use sessionstorage for keeping data. In sessionstorage have data enter image description here

but in html, not showing data form sessionstorage. when I get only {{currentUser}} in html show like this enter image description here mycode services

import { Injectable } from '@angular/core';

const USER_KEY = 'auth-user';

providedIn: 'root'
export class TokenStorageService {
  constructor() { }

  signOut(): void {

  public saveUser(user: any): void {
    window.sessionStorage.setItem(USER_KEY, JSON.stringify(user));

 public getUser(): any {
   const user = window.sessionStorage.getItem(USER_KEY);
    if (user) {
     return JSON.parse(user);

   return {};


<div class="container" *ngIf="currentUser; else loggedOut">
<header class="jumbotron">
    <strong>{{ currentUser.employee_code }}</strong> Profile
  {{ currentUser.accessToken.substring(0, 20) }} ...
  {{ currentUser.accessToken.substr(currentUser.accessToken.length - 20) }}
  {{ currentUser }}

{{ currentUser }}
<ng-template #loggedOut>
  Please login.

and component

import { Component, OnInit } from '@angular/core';
import { TokenStorageService } from '../../../services/token-storage.service';

 selector: 'app-home',
 templateUrl: './home.component.html',
 styleUrls: ['./home.component.css']
export class HomeComponent implements OnInit {
 currentUser: any;
 constructor(private token: TokenStorageService) { }

 ngOnInit(): void {
   this.currentUser = this.token.getUser();
   console.log(this.currentUser = this.token.getUser())


how i can do to use please help me

this image for {{ currentUser|json}} {{ currentUser|json}}


In TokenStorageService change getUser() method.

   public getUser(): any {
      return JSON.parse(window.sessionStorage.getItem(USER_KEY));

In HTML you are printing {{ currentUser }} Which will be an object. You need to specify the property of object.

Note: If you want to see the object in html use json pipe. ({{ currentUser | json }})