離子2本地存儲獲取並顯示數據

Question

嗨，我不能訪問我在localstorage中的數據，它總是給我錯誤。我需要幫助在我家中顯示我的數據。感謝您的幫助:)

錯誤：

打字稿錯誤 參數類型的「無極」是不能分配給類型「字符串」的參數。

this.user = JSON.parse（this.storage.get（this.key））; prompt.present（）;

打字稿

import { Component } from '@angular/core'; 
import { IonicPage, NavController, NavParams, ViewController, AlertController } from 'ionic-angular'; 
import {Storage} from '@ionic/storage'; 

/** 
* Generated class for the CrudPage page. 
* 
* See http://ionicframework.com/docs/components/#navigation for more info 
* on Ionic pages and navigation. 
*/ 

@IonicPage() 
@Component({ 
    selector: 'page-crud', 
    templateUrl: 'crud.html', 
}) 
export class CrudPage { 

    user: any = [] ; 
    key: any; 

    constructor(public navCtrl: NavController, 
    public navParams: NavParams, 
    public viewCtrl: ViewController, 
    public alertCtrl: AlertController, 
    public storage: Storage) { 
    this.storage.forEach((value) => { 
     this.user.push(value); 
    }); 
    } 

    ionViewDidLoad() { 
    console.log('ionViewDidLoad CrudPage'); 
    } 

    add() { 
    let prompt = this.alertCtrl.create({ 
     title: 'Add User', 
     message: "Enter information of the user", 
     inputs: [ 
     { 
      name: 'name', 
      placeholder: 'name' 
     }, 
     { 
      name: 'password', 
      placeholder: 'password' 
     }, 
     ], 
     buttons: [ 
     { 
      text: 'Cancel', 
      handler: data => { 
      console.log('Cancel clicked!'); 
      } 
     }, 
     { 
      text: 'Save', 
      handler: data => { 
      let key = data.name + data.password; 
      this.storage.set(key, JSON.stringify(data)); 
      console.log(data); 
      } 
     } 
     ] 
    }); 
    this.user = JSON.parse(this.storage.get(this.key)); 
    prompt.present(); 
    } 

    delete(key){ 
    this.storage.remove(key); 
    } 

    update(key){ 

    } 

} 

HTML

<!-- 
    Generated template for the CrudPage page. 

    See http://ionicframework.com/docs/components/#navigation for more info on 
    Ionic pages and navigation. 
--> 
<ion-header> 

    <ion-navbar> 
    <ion-title>Crud</ion-title> 
    </ion-navbar> 

</ion-header> 


<ion-content padding> 
    <button ion-button clear icon-start color="dark" (click)="add()"> 
     <ion-icon name="add-circle">Add User</ion-icon> 
    </button> 

    <br> 

    <ion-grid text-center> 
    <ion-row> 
     <ion-col width-100> 
     USERS 
     </ion-col> 
    </ion-row> 
    <ion-row> 
     <ion-col width-33> 
     <strong>User Name</strong> 
     </ion-col> 
     <ion-col width-33> 
     <strong>Password</strong> 
     </ion-col> 
     <ion-col width-33> 
     <strong>Action</strong> 
     </ion-col> 
    </ion-row> 
    <ion-row *ngFor="let users of user" text-center> 
     <ion-col width-33> 
     <p>{{users.name}}</p> 
     </ion-col> 
     <ion-col width-33> 
     <p>{{users.password}}</p> 
     </ion-col> 
     <ion-col width-33> 
     <button ion-button clear icon-start color="dark" (click)="delete(users.name+users.password)"> 
      <ion-icon name="trash"></ion-icon> 
     </button> 
     <button ion-button clear icon-start color="dark" (click)="update(users.name+users.password)"> 
      <ion-icon name="create"></ion-icon> 
     </button> 
     </ion-col> 
    </ion-row> 
    </ion-grid> 

</ion-content> 

請幫助:)非常感謝你:)

Answer 1

this.storage.get（this.key）返回承諾，你必須這樣做：

this.storage.get(this.key).then(value => { 
    this.user = JSON.parse(value); 
}); 

https://ionicframework.com/docs/storage/