引导图像转盘在angular中不起作用

npm install ngx-spinner --save

import { NgxSpinnerModule } from "ngx-spinner";

@NgModule({
  imports: [
    NgxSpinnerModule
  ]
})
export class AppModule { }

<button (click)="showSpinner()">显示转盘</button>

<ngx-spinner name="spinner" bdColor="rgba(51,51,51,0.8)" color="#fff" size="medium"></ngx-spinner>

import { Component } from '@angular/core';
import { NgxSpinnerService } from 'ngx-spinner';

@Component({
  selector: 'app-example',
  template: `
    <button (click)="showSpinner()">显示转盘</button>
    <ngx-spinner name="spinner" bdColor="rgba(51,51,51,0.8)" color="#fff" size="medium"></ngx-spinner>
  `
})
export class ExampleComponent {
  constructor(private spinner: NgxSpinnerService) {}

  showSpinner() {
    this.spinner.show("spinner");
    setTimeout(() => {
      this.spinner.hide("spinner");
    }, 3000);
  }
}