Magazyn lokalny w Angular 2

Question

Potrzebuję przechowywać dane w sesji przeglądarki i pobierać dane do momentu zakończenia sesji. Jak korzystać z pamięci lokalnej i sesji w Angular 2? Moduł

Answer 1

Zastosowanie Angular2 @LocalStorage, który jest opisany jako:

Ten mały Angular2/maszynopis dekorator sprawia, że ​​bardzo łatwo zapisać i przywrócić automatycznie zmienną stanu w dyrektywie (klasa nieruchomości) za pomocą localStorage HTML5' .

Jeśli trzeba wykorzystywać cookies, należy spojrzeć na: https://www.npmjs.com/package/angular2-cookie

Answer 2

Standardowa localStorage API powinny być dostępne tylko zrobić np .:

localStorage.setItem('whatever', 'something'); 

To pretty widely supported.

Pamiętaj, że musisz dodać "dom" do tablicy "lib" w swoim tsconfig.json, jeśli jeszcze jej nie masz.

Answer 3

Jak wspomniano powyżej, powinny być: localStorageService.set('key', 'value'); i localStorageService.get('key');

Answer 4

do przechowywania danych w lokalnej przechowywania,

localStorage.setItem('key', 'value'); 

Upewnij się stringify wartość, na przykład, jeśli mamy obiekt
localStorage.setItem(itemName, JSON.stringify(itemData));

OR dla pojedynczych par klucz-wartość
localStorage.setItem('currentUser', JSON.stringify({ token: token, name: name }));

pobierać dane z localStorage
user = JSON.parse(localStorage.getItem(currentUser));

Answer 5

Możemy łatwo użyć localStorage ustalania danych i odbierania danych.

Note: it works with both angular2 and angular 4 

//set the data 
localStorage.setItem(key, value); //syntax example 
localStorage.setItem('tokenKey', response.json().token); 

//get the data 
localStorage.getItem('tokenKey') 

//confirm if token is exist or not 
return localStorage.getItem('tokenKey') != null; 

Answer 6

Local Storage Set Item 
Syntax:- 
    localStorage.setItem(key,value); 
    localStorage.getItem(key); 
Example:- 
    localStorage.setItem("name","Muthu"); 
    if(localStorage){ //it checks browser support local storage or not 
    let Name=localStorage.getItem("name"); 
    if(Name!=null){ // it checks values here or not to the variable 
     //do some stuff here... 
    } 
    } 
also you can use 
    localStorage.setItem("name", JSON.stringify("Muthu")); 

Session Storage Set Item 
Syntax:- 
    sessionStorage.setItem(key,value); 
    sessionStorage.getItem(key); 
Example:- 
    sessionStorage.setItem("name","Muthu"); 
    if(sessionStorage){ //it checks browser support session storage/not 
    let Name=sessionStorage.getItem("name"); 
    if(Name!=null){ // it checks values here or not to the variable 
     //do some stuff here... 
    } 
    } 
also you can use 
    sessionStorage.setItem("name", JSON.stringify("Muthu")); 

przechowywania i pobierania danych łatwo

Answer 7

dekoratorów można używać do oznaczania zmiennych, które chcesz przechowywać.

export class SomeComponent { 

    @LocalStorage 
    public variableToBeStored: string; 

} 

Przykład jak to zrobić jest w tym artykule: https://filipmolcik.com/angular-2-local-storage/.

Answer 8

Save into LocalStorage: 
    localStorage.setItem("key",value); 

    For objects with properties: 
    localStorage.setItem("key",JSON.Stringify(object)); 

    Get From Local Storage: 
    localStorage.getItem("key"); 

    For objects: 
    JSON.parse(localStorage.getItem("key")); 

    This will save as string and retrieve as string. You need to Prase desired output 
    if value is non-string. 
    e.g. parseInt(localStorage.getItem("key")); 

** It is better to use framework provided localStroage instead of 3rd party library localStorageService or anything else. 

Answer 9

Install "kątowy 2-local-Storage"

import { LocalStorageService } from 'angular-2-local-storage';