如何在Ionic中出现用户位置错误时显示加载指示器

41zrol4v  于 2022-12-08  发布在  Ionic
关注(0)|答案(1)|浏览(147)

我不知道如何显示加载指示器,如果我有一个用户位置错误,然后当我再次获得的位置不显示加载指示器。
下面是我的代码:

async loadingIndicator () {
    const loading = await this.loadingController.create({
      cssClass: 'my-custom-class',
      message: 'error, we are getting your location...'
    })
    await loading.present()
  }

  ionViewWillEnter () {
    this.watchId = this.gpsService.watchPosition((location) => {
      this.userLatitude = location.coords.latitude
      this.userLongitud = location.coords.longitude
      console.log('User location: ', location)
    },
    { enableHighAccuracy: true, timeout: 60_000, maximumAge: null }
    )

  }

  updateLocation (location, err) {
    if (err) {
      console.error('updatelocation err: ', err)
      this.loadingIndicator()
      return
    }
    console.log('updateLocation', location)
  }
pkbketx9

pkbketx91#

您可以使用离子旋转器:https://ionicframework.com/docs/api/spinner与布尔条件.
在您的TS文件上:

isLoading = false; //the boolean you activate when you need to show a spinner
  
// I suppose it's somewhere here you want to activate the loading

  updateLocation (location, err) {
if (err) {
  this.isLoading = true;
  console.error('updatelocation err: ', err)
  this.loadingIndicator()
  return
}
this.isLoading = false;
console.log('updateLocation', location)
}

在您的html文件上

// where you need to show the spinner
<div *ngIf="isLoading">
  <ion-spinner name="circles"></ion-spinner>
</div>

相关问题