javascript - 如何将日期弹出窗口设置到下面的文本字段

Question

我正在 Angular 4 中创建日期字段，因为当我单击日期字段时，日期弹出窗口必须位于日期字段下方。

这是我的代码

 <div class="col-3">
  <div class="form-group calenderForm calenderForm1">
   <label for="templateName">REPAIR DATE (FROM)</label>
     <owl-date-time name="repairDateFrom"
       [(ngModel)]="repairDateFrom" 
       [max]="max"
       [type]="'calendar'"
       [dateFormat]="'YYYY-MM-DD'"
       [placeHolder]="'YYYY-MM-DD'"
       ></owl-date-time>
       <div class="error-message-block"></div>
     <input type="hidden" name="repairDateFrom" id = "repairDateFrom" 
     value="{{repairDateFrom | date: 'yyyy-MM-dd'}}" 
    (click)="closeDatePopUp()"/>
   </div>
  </div>

我是否必须使用 ngModel 函数，或者是否必须编写选择器插件组件才能实现结果。请帮助我，我怎样才能实现它。

Answer 1

最好、最简单的想法是安装 ng2-popover 。 Popover 适用于使用 bootstrap 的 Angular 应用程序，但如果您不想在没有 bootstrap 的情况下使用它 - 只需创建您自己的 css 类即可。 Popover 不依赖于 jquery。

如果您使用的是由 Angular 支持的 bootstrap 4，您可以开箱即用地实现弹出窗口。 Quick and easy popovers

<input type="input"  placement="bottom"
        ngbPopover="Popover text." popoverTitle="Popover on bottom">