"Property 'then' does not exist on type 'void'." when using spinner.show().then()

Question

From the docomuntation of ngx-Spinner said in FEAUTERS: "show()/hide() methods return promise", but in my Project in intellij:

this.spinner.show() returns void.

ane therefore when im trying to do this:

onCheckOut() {
    this.spinner.show().then(p => {
      this.cartService.CheckoutFromCart(1);
    });
  }

im getting the : ERROR in src/app/components/checkout/checkout.component.ts:33:25 - error TS2339: Property 'then' does not exist on type 'void'.

33     this.spinner.show().then(p => {

how i make it work?

Answer 1

Maybe the documentation is wrong. When I look at the code, it does not return a promise:

show(name: string = PRIMARY_SPINNER, spinner?: Spinner) {
    setTimeout(() => {
      const showPromise = new Promise((resolve, _reject) => {
        if (spinner && Object.keys(spinner).length) {
          spinner['name'] = name;
          this.spinnerObservable.next(new NgxSpinner({ ...spinner, show: true }));
          resolve(true);
        } else {
          this.spinnerObservable.next(new NgxSpinner({ name, show: true }));
          resolve(true);
        }
      });
      return showPromise;
    }, 10);
  }

Not sure if this was done on purpose or not, but you could raise an issue on Github.

The only way to achieve your solution would be to use the getSpinner method of the service:

const spinnerName = "my-spinner";
this.spinner.show(spinnerName);
this.spinner.getSpinner(spinnerName)
  .pipe(
     first(({show}) => !!show)
  )
  .subscribe(() => {
     this.cartService.CheckoutFromCart(1);
  }
);