Yokesh Varadhan
Yokesh Varadhan

Reputation: 1636

get user input value store it to localstorage

I am trying to get user input value, store it as an object and use it later whenever it is required

 import { Component } from '@angular/core';    
 import { Storage } from '@ionic/storage';

 @Component({
     selector: 'page-login',
     templateUrl: 'login.html'
 })
 export class LoginPage {
     file;
     user = {
         Name: '',
         email: '',
         phone: '',
         Country: ''        
     };
     constructor(public storage: Storage) { }

     writeFile(){    
         var obj = this.user;
         this.storage.set(obj).then(() => {
             this.storage.get(obj).then(() => {
                 console.log(obj.user);
             });
         });
     }
 }

And my html is

<ion-content  padding>
    <form  #form="ngForm" (ngSubmit)="logForm(form)" novalidate>
        <ion-list inset  position="bottom">
            <ion-item>
                <ion-label>Name</ion-label>
                <ion-input [(ngModel)]="user.Name" name="Name" required type="text"></ion-input>
            </ion-item>

            <ion-item>
                <ion-label >Email</ion-label>
                <ion-input [(ngModel)]="user.email" name="email" required type="Email"></ion-input>
            </ion-item>
             <ion-item>
                <ion-label >Phone Number</ion-label>
                <ion-input [(ngModel)]="user.phone" name="phone" required type="number"></ion-input>
            </ion-item>
             <ion-item>
                <ion-label >Country</ion-label>
                <ion-input [(ngModel)]="user.Country" name="Country" required type="string"></ion-input>
            </ion-item>
        </ion-list>   
            <button ion-button block (click)="writeFile()">write file</button>   
    </form> 
</ion-content>

So, when the user enters the values, it will be passed to "user" in listing.ts file. I need to store it to a local storage. I need it see that object in my console.

EDIT: I tried and I got error: enter image description here

Upvotes: 0

Views: 2268

Answers (1)

Sagar Kulkarni
Sagar Kulkarni

Reputation: 2081

I think, when you do this.storage.set(obj);, this is a promise. It is not resolved yet when you try to view it at this.storage.get(obj).then(() => { console.log(obj.user); }).

Make your code like this:

writeFile(){    
    var obj = this.user;
    this.storage.set(key,value).then(() => {
        this.storage.get(obj).then(() => {
            console.log(obj.user);
        });
    });
}

This should work. Let me know if it works. :)

EDIT : Also, you have to set it in key value format as shown like this.

I also have a different mechanism by which I do local storage. It is like this:

localStorage.setItem('user',JSON.stringify(jsonObject));
var temp = JSON.parse(localStorage.getItem('user'));
console.log("Temp - ",temp);

This also works fine.

Upvotes: 1

Related Questions