javascriptangularngx-spinner

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

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 ?

Solution

  • 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(...)