Question

我发出API请求以获取一些数据取决于用户Option。我获得了此用户选项，并将其存储在本地存储中，以在API服务中将其用作Url中的参数。
我的问题是这些请求只能在第一个中正常工作。当用户后退并选择另一个选项时，服务将从本地存储中获取旧数据，而不是更新后的数据。我该如何解决这个问题。

通话结束后，我尝试清除本地存储，但这不起作用

constructor(public http: HttpClient,public storage : Storage ) {

this.storage.get('cat').then((usercategory) => {
  this.usercategory =  usercategory;
  console.log(this.usercategory)
 });

 this.storage.get('loc').then((userlocation) => {
  this.userlocation =  userlocation;
  console.log(this.userlocation)

 });

 this.storage.get('serv').then((userservice) => {
  this.userservice =  userservice;
  console.log(this.userservice)

 });

getdata(){

return this.http.get(this.url + "&location=" + this.userlocation + 
"&price=" + this.usercategory + "&service=" + this.userservice);

}

Answer 1

似乎您正在更新服务类构造函数的属性，并且仅在服务实例化时才调用它。

您可以创建一个函数来获取值并在每次调用API时调用该函数，这样，每次调用API时，属性都会更新。

并且请记住，仅将需要初始化类属性或在实例化期间仅被调用一次的代码放在构造函数中。

constructor(public http: HttpClient,public storage : Storage ) {}

getlocalstorage(){

  this.storage.get('cat').then((usercategory) => {
  this.usercategory =  usercategory;
  console.log(this.usercategory)
 });

 this.storage.get('loc').then((userlocation) => {
  this.userlocation =  userlocation;
  console.log(this.userlocation)

 });

 this.storage.get('serv').then((userservice) => {
  this.userservice =  userservice;
  console.log(this.userservice)

 });
}


getdata(){
getlocalstorage();
return this.http.get(this.url + "&location=" + this.userlocation + 
"&price=" + this.usercategory + "&service=" + this.userservice);

}

Answer 2

我通过从页面组件中的localStorage获取值并将其传递给API服务解决了该问题。

             constructor(private AuthService: DubaiService, 
public loadingController: LoadingController,
public storage: Storage,
 private SettingsAuth :SettingsService,
 public modalController: ModalController) {

this.showLoader()


   Promise.all([this.storage.get("cat"),
   this.storage.get("loc"),
   this.storage.get("serv")]).t hen(values => {
  this.usercategory = values[0];
  this.userlocation = values[1];
  this.userservice = values[2];
  console.log(values)
  })
}


 ionViewDidEnter(){

this.AuthService.getListings(this.usercategory,this.userlocation,this.userservice)
 .subscribe((data) => {
  console.log(data);
  this.listing_items = data, 
  err => console.log(err);
  this.hideLoader()
  ,
  () =>  console.log("done");
   this.hideLoader();
   });



   }

和此“我的API调用”方法：

            getListings(usercategory,userlocation,userservice){

           return this.http.get(this.url + "&location=" + userlocation + 
           "&price=" + usercategory + "&service=" + userservice);

            }

Answer 3

从本地存储获取值是异步的。因此，在使用这些值之前，您需要先等待这些值：

constructor(public http: HttpClient,public storage : Storage ) {}

async getlocalstorage(){

  await this.storage.get('cat').then((usercategory) => {
  this.usercategory =  usercategory;
  console.log(this.usercategory)
 });

 await this.storage.get('loc').then((userlocation) => {
  this.userlocation =  userlocation;
  console.log(this.userlocation)

 });

 await this.storage.get('serv').then((userservice) => {
  this.userservice =  userservice;
  console.log(this.userservice)

 });
}

我在使用本地存储获取的数据进行Http调用时遇到问题

3 个答案: