CODEWITHSUNDEEP
angulartypescripthttppromisespinner
TropicalViking
TropicalViking

Reputation: 425

Using ngx-spinner in a http subscribe operation in Angular

I want to use a spinner in an Angular Application. I've found one called ngx-spinner. However there is not enough examples on the practical use of it. I want to use it in my http requests. How can I show hide/show the spinner correctly ?

public getCars(){
 this.spinner.show();
  this.appService.getCars().subscribe(
    car => {
      this.carList=car;
      for (let i = 0; i < this.carList.length; i++) {
        let make = this.carList[i].make;
      }
    },
  );
 this.spinner.hide();

}

I installed ngx-spinner and imported it correctly. The library is working but I just cannot use it in my http requests correctly. Any help welcomed.

Upvotes: 2

Views: 1274

Answers (2)

Yuvraj Chauhan
Yuvraj Chauhan

Reputation: 239

Try this:

public getCars(){
     this.spinner.show();
      this.appService.getCars().subscribe(
        car => {
          this.carList=car;
          for (let i = 0; i < this.carList.length; i++) {
            let make = this.carList[i].make;
          }
          this.spinner.hide();
        },
      );
    }

Upvotes: 1

brandt.codes
brandt.codes

Reputation: 923

I think you have to move "this.spinner.hide();" directly under the closing brace of the "for" statement. This is the success-callback.

Upvotes: 4

Related Questions