how can i pass all localstorage values to response

问题

I wish to pass fullName, lastLogon, and RolePermissions as at the moment I'm only getting UserId

Sorry I was unable to find an answer to this directly.

dashboard.service.ts

  getUsersById(id): Observable<any> {
    return this.http.get<any>(`https://www.mywebsite.net/umbraco/api/UsersApi/GetUsersById/1${id}`, {
      headers: new HttpHeaders()
        .set('Authorization', this.bearer_token)
    });
  }

  getTheUsersId(){
  this.getUsersId(localStorage.UserId).subscribe((res) => {
    console.log(res);
    this.responseId = res;
    this.StoreOnLocalStorage(res);
  })
}
  
  StoreOnLocalStorage( data: any ) {
   localStorage.setItem("fullName", data.Fullname);
   localStorage.setItem("LastLogon", data.LastLogon);
   localStorage.setItem("UserId", data.Id);
   localStorage.setItem("RolePermissions", JSON.stringify(data.UserRoles[0].RolePermissions))
}

}

dashboard.component.ts

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { DashboardService } from '../dashboard.service';

@Component({
  selector: 'app-dashboard',
  templateUrl: './dashboard.component.html',
  styleUrls: ['./dashboard.component.scss']
})
export class DashboardComponent implements OnInit {

  constructor( private activatedRoute: ActivatedRoute,private dashboardService:DashboardService,  ) { }
  accessToken = null;
  UserId = null;
 responseId = null;
 UserRoles = null;
 Fullname= null;

 
  ngOnInit() {
    this.dashboardService.getTheUsersId();
    this.accessToken = localStorage.getItem('accessToken');
    this.UserId = localStorage.getItem('UserId');
    this.Fullname = localStorage.getItem('FullName');
    this.UserRoles = localStorage.getItem('RolePermissions');
  } 
}

At the moment I'm only able to display the UserID as that is only what is being set in the response and I wish to have the other values passed from localstorage

My HTML

<button  class="btn btn-primary mr-3" (click) = "getById()">Get By Id</button>
  <div class="row">
        <div class="col-6">
            <h1>Get By Id</h1>
            <p> UserID {{UserId}} </p>
            <ul *ngIf = "responseId != null">
                <li><span>Id: </span>{{responseId.Id}}</li>
                 <li><span>Fullname </span>{{responseId.Fullname}}</li>
            <li><span>Last Logon: </span>{{responseId.LastLogon}}</li>


            
  <span *ngFor="let role of responseId.UserRoles">
     Id: {{ role.Id }} - {{ role.Permission }}
     UserRole: {{role.Roles}} - {{role.UserRoles}}
 
  </span>

So far only UserID is displayed.

回答1:

You can retrieve and store values from localstorage to an object and use it later on. Please refer to below answer for How To?

Get HTML5 localStorage keys

来源：https://stackoverflow.com/questions/64027183/how-can-i-pass-all-localstorage-values-to-response

标签

angular

typescript

angular8