CODEWITHSUNDEEP
angularspinner
Sunny Goel
Sunny Goel

Reputation: 2132

Ngx-Spinner is not working in feature module

Ngx-Spinner it is working fine when i call it in inside the main module i.e. app-module.

I am using line spinner on complete page so i define it inside the app-component.html

<ngx-spinner bdColor="rgba(51, 51, 51, 0.47)" size="medium" color="#fff" type="line-spin-clockwise-fade"></ngx-spinner>

but in case of when i am trying to show this spinner by calling from a component of feature module , it is not working .

Upvotes: 3

Views: 12570

Answers (5)

euggood
euggood

Reputation: 1

It works after adding provideSpinnerConfig({type: 'ball-spin-clockwise'}), in the providers array of appConfig file. Note that .forRoot() is not working and NgModule is not default in angular app (at least in the current releases). Don't know why provideSpinnerConfig is not stated in the NgxSpinner documentation

Upvotes: 0

dasunse
dasunse

Reputation: 3089

Try this example in stackblitz

In your module import NgxSpinnerModule

import { NgxSpinnerModule } from "ngx-spinner";


@NgModule({
  imports: [
    CommonModule, NgxSpinnerModule
  ]
})
export class UserModule { }

Upvotes: 0

Tushar Walzade
Tushar Walzade

Reputation: 3809

Separating out your commonly used modules with a shared module file is a good practice. So, your SharedModule would be -

@NgModule({
    imports: [
        CommonModule,
        NgxSpinnerModule,
    ],
    exports: [    // optional in your case
        NgxSpinnerModule
    ],
    providers: [
        // ...
    ]
})
export class SharedModule { }

Then,

  • Just import this wherever your NgxSpinnerModule is required.

  • You may add many external modules to the same as required.

Upvotes: 1

user4717662
user4717662

Reputation:

When working with feature modules and lazy loading, you also need to import the NgxSpinnerModule into your feature module.

@NgModule({
    imports: [
        CommonModule,
        NgxSpinnerModule,
        ...
    ],
})
export class FeatureModule { ... }

Hope it helps

Upvotes: 1

Suresh Kumar Ariya
Suresh Kumar Ariya

Reputation: 9764

You need to move this ngx-spinner into separate component. You can call this spinner component using Subject/BehaviorSubject using next() operator in the source component.

You can listen for the data in the 'ngx-spinner' component using subscribe method for display/hide the spinner.

Upvotes: 1

Related Questions