angular - BsDatepicker 没有出现在子组件中(ngx-bootstrap)

Question

我正在使用 Angular 5，我想使用 ngx-bootstrap bsDatepicker 模块。我按照 https://ngx-universal.herokuapp.com/datepicker 中的步骤操作但日期选择器没有出现。我刚收到控制台警告消息。我没有收到任何错误消息

warn-once.js:10

BsDatepickerModule is under development,

BREAKING CHANGES are possible,

PLEASE, read changelog

Datepicker 元素也没有渲染

我的 app.module.ts

import { BsDatepickerModule } from 'ngx-bootstrap/datepicker';
...
imports: [
   ... ,
   BsDatepickerModule.forRoot(),
   ... ,
],

我的custom.component.html

  <div class="col-md-6">
     <input type="text" class="form-control" placeholder="Datepicker" bsDatepicker formControlName="date" />
  </div>

我还将 bsDatepicker css 文件的 CDN 链接添加到我的 index.html

<link rel="stylesheet" href="https://unpkg.com/ngx-bootstrap/datepicker/bs-datepicker.css">

ngx-bootstrap、Angular 和 Bootstrap 的版本:

• ngx-bootstrap: ^2.0.2
• Angular :5.2.7
• Bootstrap :3.3.7

构建系统:

• Angular CLI:1.7.2
• 网络包:3.11.0
• typescript :2.4.2

Answer 1

这个问题有两种解决方案。您应该根据应用程序的架构做出此决定。如果您的应用程序较小且只有几个子组件，则只需将 BsDatepickerModule.forRoot() 添加到子组件的导入中即可。如果你有一个更大的应用程序，或者一个会随着时间的推移而增长的应用程序，那么最好的解决方案是将 BsDatepickerModule.forRoot() 添加到你的导入中，并将 BsDatepickerModule 添加到你的导出中您的共享模块。如果您没有共享模块(您应该有)，那么检查this和 this出。

大型应用解决方案(最佳)

import { BsDatepickerModule } from 'ngx-bootstrap';

@NgModule({
imports: [
    .....
    BsDatepickerModule.forRoot(),
    .....
  ],
exports: [
    .....
    BsDatepickerModule,
    .....
   ]
})

小应用解决方案(好但不是最好的)

import { BsDatepickerModule } from 'ngx-bootstrap';

@NgModule({
imports: [
    .....
    BsDatepickerModule.forRoot(),
    .....
  ]