【问题标题】:Ionic Storage returning undefined the first time离子存储第一次返回未定义
【发布时间】:2018-01-26 07:01:06
【问题描述】:

我有一个存储设置为 access_token,当我第一次让它返回时我失败了

提供者:

getLayMinisters(){
   console.log(this.access_token);
   return this.http.get(
     this.api.url() + '/faith-leader/' + 'lay-ministers',
     {
       headers: new Headers({ "Authorization": "Bearer " + this.access_token })
     }
   )
   .map(
     response => response.json()
   );
}

这是这个文件的构造函数

access_token: any;
layMinister_id: string;

constructor(
    public http: Http,
    public storage: Storage,
    public api: ApiProvider
) {
    this.storage.get('access_token').then(
      (access_token) => {
        this.access_token = access_token;
      }
    )
  }

这是我的页面

getLayMinisters(){
    this.layMinisterProvider.getLayMinisters().subscribe(
      data => {
        this.layMinisters = data;
      }
    );
}

这是在它上面

layMinisters = [];

constructor(
    public navCtrl: NavController, 
    public navParams: NavParams,
    public layMinisterProvider: LayMinisterProvider,
    public alertCtrl: AlertController
) {}

ionViewDidLoad() {
    this.getLayMinisters();
}
ionViewWillEnter() {
    // this.getLayMinisters();
}

当页面第一次运行时,它返回console.log(this.access_token) 返回为undefined,然后我得到 api 没有响应的错误。但是当我再次单击链接以打开页面时,它运行良好并打印 access_token 并运行 api 调用并打印所有数据

【问题讨论】:

  • this.storage.get 是异步操作。就像setTimeout(()=>{}, 2000)

标签: angular typescript ionic-framework ionic2 ionic3


【解决方案1】:

当你调用 getLayMinisters() 时,access_token 是未定义的,因为这些任务是异步的,所以当你做 http.get 时,可能 this.storage.get() 没有完成,因为这是一个承诺,如果你在 http.get 函数中编码

setTimeout(()=>{
  console.log(this.access_token)
},1000)

也许用 1000 毫秒可能会打印它(这取决于 storage.get() 承诺响应时间)。

要解决它,您可以在layMinisterProvider 中创建一个函数:

getToken(){
    return this.storage.get('access_token')
}

在页面中:

getLayMinisters() {
    if(!this.layMinisterProvider.access_token){
        this.layMinisterProvider
        .getToken()
        .then((access_token) => {
            this.layMinisterProvider.access_token = access_token;
            this.getData();
        })
    }else{
        this.getData();
    }
}
getData(){
    this.layMinisterProvider
                .getLayMinisters()
                .subscribe(data => {
                    this.layMinisters = data;
                });
}

请记住,提供者必须拥有公开的 access_token。

【讨论】:

  • 职责分离,你可以把它放在服务中,因为它是它的职责。很抱歉。
猜你喜欢
  • 2017-08-21
  • 2017-02-07
  • 1970-01-01
  • 2014-08-27
  • 2020-07-19
  • 2018-01-17
  • 1970-01-01
  • 1970-01-01
  • 2020-10-13
相关资源
最近更新 更多