ng-bootstrap datepicker弹出窗口没有显示完整的Angular 4

Question

我已经搜索过，没有发现任何关于这个特定错误的内容。所以，这里有：

我正在开发一个Angular 4应用程序，并且需要在表单上放置ng-bootstrap datepicker，但是没有完全显示它...就像图像一样：

这是我的代码 HTML：

<form>

    ...
    <div class="form-group">

        <label for="startDate" class="control-label">Start Date</label>
        <div class="input-group">
            <input class="form-control" placeholder="yyyy-mm-dd" name="startDate" [(ngModel)]="model" ngbDatepicker #d="ngbDatepicker">
            <div class="input-group-addon" (click)="d.toggle()" >
                <i class="fa fa-calendar" aria-hidden="true"></i>
            </div>
        </div>

    </div>

    <div class="form-group">

        <label for="startDate" class="control-label">End Date</label>
        <div class="input-group">
            <input class="form-control" placeholder="yyyy-mm-dd" name="endDate" [(ngModel)]="model" ngbDatepicker #d="ngbDatepicker">
            <div class="input-group-addon" (click)="d.toggle()" >
                <i class="fa fa-calendar" aria-hidden="true"></i>
            </div>
        </div>

    </div>

</form>

component.ts：

import { Component,
ViewEncapsulation } 
from '@angular/core';

import { routerTransition }
from '../../router.animations';



import {NgbModal,
ModalDismissReasons} 
from '@ng-bootstrap/ng-bootstrap';





@Component({

...

})

export class
ProgramFormComponent {
...
model;
...



constructor(private
modalService: NgbModal) {

...

}



...

无论如何，找不到错误，ng-bootstrap文档上的示例工作正常，而且在Plunker上也是如此..