Is there a way to use ngx-spinner in standalone angular apps?

625 Views Asked by At

How do I use ngx-spinner in my standalone angular app ?

There's no app.module to import it. I can't import it in the component itself because I get "Component imports must be standalone components, directives, pipes, or must be NgModule" error. And if I just declare it on constructor I get "'ngx-spinner' is not a known element" in the template.

How do I use it in standalone apps ?

1

There are 1 best solutions below

4
On BEST ANSWER

In your main.ts, use the following:

bootstrapApplication(App, {
  providers: [
    importProvidersFrom(NgxSpinnerModule.forRoot(/*config*/)),
    provideAnimations()
  ]
});

What you set in the providers array is used the same as in the old app.module.ts's imports (ie. it's declaring app-wide modules)


Edit on suggestion:

Remember to add the location of the CSS file in angular.json (styles array) and to import NgxSpinner in the components that use it.

Basically, follow the docs except for the providers array in bootstrapApplication(...)