Question

任何人都可以帮助，

所以我已使用@ ngx-pwa将登录数据存储在名为login的本地存储密钥中

在这里我试图获取这些数据并显示它，但是我却无法定义！

public customerProfile

ngOnInit() {
 this.getProfileData();
 console.log(this.cutomerProfile) //shows undefined
}

getProfileData() {
 this.localStorage.getItem('login').subscribe((login) => {
   this.customerProfile = login;
   console.log(this.customerProfile.user) //shows login data
 })
}

Answer 1

问题是，由于console.log()尚未准备就绪，因此您目前未设置ngOnInit() this.cutomerProfile处的this.localStorage.getItem('login')。

使用回调可能是您的解决方案：

public customerProfile

ngOnInit() {
 this.getProfileData(() => console.log(this.cutomerProfile));
}

getProfileData(cb) {
 this.localStorage.getItem('login').subscribe((login) => {
   this.customerProfile = login;
   console.log(this.customerProfile.user) //shows login data
   cb();
 })
}

您也可以使用承诺：

public customerProfile

ngOnInit() {
 this.getProfileData().then(() => console.log(this.cutomerProfile));
}

getProfileData() {
  return new Promise((resolve, reject) => {
    this.localStorage.getItem('login').subscribe((login) => {
      this.customerProfile = login;
      console.log(this.customerProfile.user) //shows login data
      resolve();
    })
  });
}

Answer 2

如果需要，可以使用Promise和async/await函数。

public customerProfile;

async ngOnInit() {
 this.customerProfile = await this.getProfileData();
  // The console.log (next line) will wait for the promise to be resolved.
  console.log(this.customerProfile);     }

getProfileData() {
  return new Promise((resolve, reject) => {
    this.localStorage.getItem('login').subscribe((login) => {
      resolve(login);
    })
  });
}

Answer 3

记录customerProfile值的最简单解决方案是调用一个函数，该函数从this.localStorage.getItem（）中记录该变量，该函数是异步的，因此在获取存储的项目后，将像下面这样调用该回调函数：

ngOnInit() {
 this.getProfileData();
}

getProfileData() {
 this.localStorage.getItem('login').subscribe((login) => {
   this.customerProfile = login;
   console.log(this.customerProfile.user) ;
   callback();
 })
}

callback(){
    console.log(this.cutomerProfile);
}

从函数外部调用变量不起作用

3 个答案: