ng2-bootstrap — нет провайдера для TimepickerConfig при импорте в отдельный модуль

Я использую ng2-bootstrap v1.2.5.

В моем приложении я загружаю два компонента Timepicker в родительский компонент, используя @ViewChild. Первоначально я сделал это, объявив ExampleComponent непосредственно в AppModule. Этот подход работал нормально.

Теперь я хочу переместить ExampleComponent в отдельный модуль (ExampleModule). Несмотря на то, что модуль новый, в ExampleComponent нет изменений кода. Однако, когда Timepicker импортируется в ExampleComponent, теперь я получаю сообщение «Нет провайдера для TimepickerConfig!» ошибка.

Вот псевдокод:

/**
 * AppModule
 */
@NgModule({
    bootstrap: [ AppComponent ],
    declaration: [ AppComponent ],
    imports: [ 
        BrowserModule,
        Ng2BootstrapModule,
        ExampleModule,
        ... etc.
    ]
})
export class AppModule {}


/**
 * ExampleModule
 */
@NgModule({
    declarations: [ ExampleComponent ],
    imports: [
        CommonModule,
        Ng2Bootstrap,
        ... etc.
    ],
    exports: [ ExampleComponent ]
})
export class ExampleModule {}


/**
 * ExampleComponent
 */
import {Component, ViewChild} from '@angular/core';
import {TimepickerComponent} from 'ng2-bootstrap/timepicker';

export class ExampleComponent {
    @ViewChild('startTimepicker') startTimepicker: TimepickerComponent;
    @ViewChild('endTimepicker') endTimepicker: TimepickerComponent;

    ... etc.
}

Что вызывает новую ошибку импорта?


angular ng2-bootstrap
person ebakunin    schedule 24.01.2017    source источник
comment
Предлагаю воспроизвести в плункере   -  person Bean0341    schedule 25.01.2017

Ответы (2)


arrow_upward
4
arrow_downward

Я понял проблему. В дополнение к предложению Рауля импортировать TimepickerModule вместо одного компонента, класс TimpickerConfig должен быть явно предоставленным, то есть импортированным и добавленным в список поставщиков.

Псевдокод:

import {TimepickerModule, TimepickerConfig} from 'ng2-bootstrap/timepicker';

@NgModule({
    declarations: [ ExampleComponent ],
    imports: [
        CommonModule,
        TimepickerModule,
        ... etc.
    ],
    exports: [ ExampleComponent ],
    providers: [ TimepickerConfig ]
})
export class ExampleModule {}
person ebakunin    schedule 25.01.2017

arrow_upward
1
arrow_downward

Я думаю, проблема в том, как вы импортируете ng2-bootstrap в свой новый модуль, попробуйте импортировать только средство выбора времени:

import { TimepickerModule } from 'ng2-bootstrap/timepicker';

и в вашем массиве импорта будет выглядеть так:

@NgModule({
    declarations: [ ExampleComponent ],
    imports: [
        CommonModule,
        TimepickerModule,
        ... etc.
    ],
    exports: [ ExampleComponent ]
})
export class ExampleModule {}

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

person Raul Vargas Muñoz    schedule 24.01.2017