ng-bootstrap datepicker弹出位置没有改变

Question

我正在尝试使用 NgbInputDatePicker 输入选项下列出的放置选项。

我想更改弹出日期选择器的默认左下位置，但是当我尝试在 plunker 示例中使用放置时（https://ng-bootstrap.github.io/app/components/datepicker/demos/popup /plnkr.html）它不会改变弹出窗口的位置。

我试过了：

在输入标签内添加 [placement]="top"：

<input class="form-control" placeholder="yyyy-mm-dd"
         name="dp" [placement]="top" [(ngModel)]="model" ngbDatepicker #d="ngbDatepicker">

我也尝试过将其放在父 div 中：

<div class="input-group" placement="top">
  <input class="form-control" placeholder="yyyy-mm-dd"
         name="dp" [(ngModel)]="model" ngbDatepicker #d="ngbDatepicker">

但似乎都没有改变弹出位置。我是 Angular 的新手，所以也许我的语法有问题？我注意到文档中的其他输入 API 似乎是以这种方式使用的，所以我认为它可能会起作用......

我正在使用 ng-bootstrap 1.0.0-beta.2 和 Angular 4.3.4。

谢谢。

Answer 1

问题是您正在使用对表达式的绑定（top表示表达式in [placement]="top"），而我认为您的意图是使用"top"常量。您可以使用以下 2 种方法之一来解决它：

• placement="top"（首选）
• [placement]="'top'"（注意周围的附加引号top）

如果指定正确，该placement选项可以完美地工作，如以下插件所示：http://plnkr.co/edit/NCNmpm3tlxapH4jZS08F ?p=preview