Ngx-Spinner не работает в функциональном модуле

Question

Ngx-Spinner он работает нормально, когда я вызываю его внутри основного модуля, т.е. app-module.

Я использую line spinner на полной странице, поэтому я определяю его внутри app-component.html

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

, но в случае, когда я пытаюсь показать этоспиннер, позвонив из компонента функционального модуля, он не работает.

Answer 1

При работе с функциональными модулями и отложенной загрузкой также необходимо импортировать NgxSpinnerModule в свой функциональный модуль.

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

Надеюсь, это поможет

Answer 2

Хорошей практикой является разделение часто используемых модулей с помощью общего файла модулей.Таким образом, ваш SharedModule будет -

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

Тогда

• Просто импортируйте его туда, где требуется NgxSpinnerModule.

• Вы можете добавить множество внешних модулей к тем же, что и требуется.

Answer 3

Вам нужно переместить этот ngx-spinner в отдельный компонент.Вы можете вызвать этот компонент счетчика, используя Subject / BehaviorSubject, используя оператор next () в исходном компоненте.

Вы можете прослушивать данные в компоненте ngx-spinner, используя метод подписки для отображения / скрытия счетчика.