Store objects in LocalStorage

Ionic Framework ionic-v3
1

Hello,

this.local.set('user', user);

I try to store an object in local storage and it doesn’t work.

I have a string when I get it back further in the code :

console.log(this.local.get('user')); OUTPUT => "[object Object]"

Is there something to do before to store an object ?

3 Likes
2

Hi

localStorage.setItem("lastname", "Smith")

http://www.w3schools.com/html/html5_webstorage.asp

Or better: use the Storage object and Sqlstorage as found in the api of Ionic2

import { Storage, SqlStorage } from 'ionic-framework/ionic';
		
this.storage = new Storage(SqlStorage);

this.storage.get('questionnaires').then((data) => {
if (data != null) this.questionnaires = JSON.parse(data);
	else this.loadDefaultQuestions();

And to store Objects, use JSON.stringify(myObject) to store and JSON.parse(...) to turn back

Regards

Tom

6 Likes
3

Hi @iborik ,

I create a Service for $localstorage depends on the recommendation from ionic site

angular.module('app').factory('$localstorage', ['$window', function ($window) {
  return {
    set: function (key, value) {
      $window.localStorage[key] = value;
    },
    get: function (key, defaultValue) {
      return $window.localStorage[key] || defaultValue;
    },
    setObject: function (key, value) {
      $window.localStorage[key] = JSON.stringify(value);
    },
    getObject: function (key) {
      return JSON.parse($window.localStorage[key] || '{}');
    },
    remove: function(key) {
      $window.localStorage.removeItem(key);
    }
  }
}]);

It will be easy to manage $localstorage at the app.

Then do $localstorage.setObject('user', user);

3 Likes
4

Thank you for your answer

1 Like
5

You can just stringify them, see here

1 Like
6

Yes, thank you, but I speak about Ionic2

1 Like
7

I have the problem too, any sugestion to solved??, Ibori, u can solve this problem??.
Thanks

1 Like
8

Hi,

yes, stringify them before to store them just as he said here :

2 Likes
9

Thanks, this work fine.

1 Like
10

I set up a service that set and get the profile of the user

@Injectable()
 export class CurrentUser {
 local: Storage;

   constructor(private http: Http, private _profile: IProfile) {
    this.local = new Storage(LocalStorage);
}

 setProfile(username: string, token: string): void {
     this._profile.token = token;
      this._profile.username = username;
     this._profile.loggedIn = true;
     this.local = new Storage(LocalStorage);
     let val = JSON.stringify(this._profile);
     this.local.set("user-profile", val);
}
 getProfile(): any {
    this.local.get("user-profile").then((profile) => {
     var val = JSON.parse(profile);
    console.log(val);
    return profile;
});

}
}

2 Likes
11

It seems that you need to retrieve the data this way

this.storage.get(‘user’).then((value) => {
console.log("user " + value);
//then do the stuff with the user name
});

There is a small delay in the retrieving part, so you have to wait to get the value otherwise you don’t get anything.

1 Like
12

Hi!

That is quite interesting btw! Taking into account the 2.0.0 final release, which packages should I import in order to have the same features?

Thnx in advance

1 Like
13

Hi

No clue. Kind of stopped developing for a while.

Regards

Tom

1 Like
14

hi sir tommertom.
how to set the value here for my database in 000webhost?.

// set a key/value
storage.set(‘name’, ‘Max’);

// Or to get a key/value pair
storage.get(‘name’).then((val) => {
console.log(‘Your name is’, val);
})
}
}

this is my json database:

[{“act_id”:“1”,“act_title”:“Thanksgiving Day”,“act_date”:“November 27, 2016”,“act_content”:“To gather in unity ? It is refreshing and invigorating when people come together, in celebration of a common purpose. It is a reconciliation of differences as well as a time of healing. In sharing our victories as well as our struggles, we find strength and hope…”}]

tnx in advance sir.

1 Like
15

A post was split to a new topic: How to keep set and get methods of storage in single service?