ngbTimepicker 无法在具有反应形式的 ngbmodal 中工作

Question

我在尝试使用 NgbTimepicker[= 时遇到错误（没有将 "exportAs" 设置为 "NgbTimepicker" 的指令） 29=] 以反应形式出现在模态中。

在app.module.ts中，我导入ngbModule:

import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; @NgModule({ declarations: [ ... ], imports: [ ... NgbModule.forRoot(), ], providers: [], bootstrap: [AppComponent] })

在page.component.ts,

import { NgbModal, NgbTimepicker} from '@ng-bootstrap/ng-bootstrap'; ... workingStartTime: [null, Validators.compose([Validators.required])],

在page.component.html

<input type="text" formControlName="workingStartTime" placeholder="" NgbTimepicker #timepicker="NgbTimepicker (click)="timepicker.toggle()">

我花了几个小时没有成功地寻找问题所在。难道我做错了什么？谢谢

Answer 1

你做错了，来自 ng-bootstrap 也提到使用 like:

<ngb-timepicker [(ngModel)]="time" formControlName="time"></ngb-timepicker>

我已经在 stackblitz

中发布了示例

希望这有用，如果您需要更多，请检查并告诉我。

Answer 2

接受的答案不正确，这不是反应形式的工作原理。 ngModel 用于模板表单 - 而不是 OP 所要求的。要以反应形式设置值，您可以像在 html 中那样进行操作。在代码中：

this.form.controls.time.setValue({
  "hour": 15,
  "minute":30
});

如果您的应用程序中有多个时间选择器，您可以编写时间选择器和数据适配器，如下所示：自定义时间适配器

ngbTimepicker 无法在具有反应形式的 ngbmodal 中工作

ngbTimepicker not working in ngbmodal with reactive form

ng-bootstrap

angular