Ionic 2存储返回null

时间:2016-11-21 19:01:22

标签: ionic2

我在RC0之后堆积了Ionic 2 Storage。 全部由instruction完成。

login.ts

Word.run(function (ctx) {

            var fruits = [["Apple", "red", "round", "crunchy"], ["Banana", "yellow", "long", "mushy"], ["Pear", "green", "oblong", "variable"]];
            var fruitsNonuniform = [["Apple", "red"], ["Banana", "yellow", "long", "mushy"], ["Pear", "green", "oblong"]];
            var fruitsUnderfilled = [["Apple", "red", "", ""], ["Banana", "yellow", "long", "mushy"], ["Pear", "green", "oblong", ""]];

// parameters of the insert table: number of rows to insert, number of columns, insert location (in this case the table is inserted at the beginning of the document, and finally the values which is the array itself.
            var table = ctx.document.body.insertTable(fruits.length, fruits[0].length, "start", fruits);
            ctx.load(table);
            return ctx.sync().then(function () {
                table.style = "Grid Table 6 Colorful - Accent 2";
                return ctx.sync().then(function () {
                   
                });

            }).catch(function (e) {
                console.log(e.message);

            });
        });

feed.ts

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Storage } from '@ionic/storage';
import {TabsPage} from '../tabs/tabs';

@Component({
  selector: 'page-login',
  templateUrl: 'login.html'
})
export class LoginPage {
  driver: any;
  phone: any;

  getPhone(){
    return this.storage.get("phone");
  };

  constructor(private navCtrl: NavController, public storage: Storage)
  {
    this.driver = {
      phone: '',
      password: ''
    };

      this.getPhone().then(phone => {
        console.log('RAW_PHONE: ' + phone);
        this.phone = phone;
        if (this.phone != undefined || this.phone != null){
          console.log('PHONE: ' + this.phone);
          this.navCtrl.setRoot(TabsPage);
        }
      });

  }

在模拟器上成功启动后,我会看到一个日志:

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

@Component({
  selector: 'page-feed',
  templateUrl: 'feed.html'
})
export class FeedPage {
  getTruck(){
    return this.storage.get("truck")
  };

  constructor(public storage: Storage) {
    this.getTruck().then(val => {
        console.log('SAVED TRUCK: ' + val);
      });
  }

首次尝试auth我得到null,但随后我关闭应用程序,从应用程序管理器中删除它,再次启动并尝试auth - 并获得保存的值。但是我仍然需要登录,因为Storage丢失了我的登录值。 有什么问题?

3 个答案:

答案 0 :(得分:2)

在我的情况下,这样可以正常工作,您需要在存储准备就绪后继续(然后)。

示例:

this.storage.set('forms_data', this.forms_data).then((val) => {
      this.navCtrl.setRoot(HomePage);
    });

答案 1 :(得分:1)

安装cordova-sqlite-storage插件:

cordova plugin add cordova-sqlite-storage --save

安装“@ ionic / storage”软件包(Ionic 2的可选项> = RC.0):

npm install --save @ionic/storage

在/src/app/app.module.ts,

中添加以下行
import { Storage } from '@ionic/storage';

export function provideStorage() {
  return new Storage(['sqlite', 'websql', 'indexeddb'], { name: 'database_name' });
}

// Add "Storage" inside providers
providers: [
   { provide: Storage, useFactory: provideStorage }, Storage
]

使用set()和get()方法在页面中存储和检索数据。

import { Storage } from '@ionic/storage';

export class MyApp {
  constructor(storage: Storage) {
    storage.set('key', 'value 1'); // store
    storage.get('name').then((val) => { // retrive
      console.log('Your value is', val);
    })
  }
}

对于澄清,请查看CodeExpertz

适用于YouTube

的视频参考

答案 2 :(得分:0)

每当你看到这样的事情时:

myFunction().then(....)

myFunction(callbackFunction());

然后myFunction正在做一些异步工作 - >因此执行此功能可能需要一些或更多时间。 但JavaScript运行完成 - >它从你的第一行代码开始,然后通过你的代码 - >表示浏览器不会等到调用then()的回调。它启动this.storage.get()函数并继续使用console.log。并且在某些时候this.storage.get()已经完成并调用你在then()中定义的回调 所以你需要像这样使用:

console.log('Your value is', storage.get('name'));