Integrating Ionic 3 loader within webservice

Ionic Framework ionic-v3
1

Hey guys

I just wanted to find out how I would use a loader correctly in ionic3. I successfully create and display a loader. My issue is dismissing it after a webservice is called.

ionViewDidLoad() {
    this.loading = this.loadingCtrl.create({
      spinner: 'custom-spinner',
      content: `
        <div class="custom-spinner-container">
          <div class="custom-spinner-box"></div>
        </div>`
    });

    this.http.get('https://numetro.eohdigitalpreview.co.za/api/?movies=true')
      .subscribe(data => {
        this.loading.present();
        this.getMovieList = data.json();
        this.loading.dismiss();
      });
}

the dismiss is what I am struggling with, where would I put it?

2

okay, I think i found the correct implementation of it. The creation and presenting of the loader goes before the function and the dismiss goes inside it like so:

  ionViewDidLoad() {
    this.loading = this.loadingCtrl.create({
      spinner: 'custom-spinner',
      content: `
        <div class="custom-spinner-container">
          <div class="custom-spinner-box"></div>
        </div>`
    });
    
    this.loading.present();
    this.http.get('https://numetro.eohdigitalpreview.co.za/api/?movies=true')
      .subscribe(data => {
        this.getMovieList = data.json();
          this.loading.dismiss();
      });
  }
2 Likes