ng-bootstrap 日期选择器弹出窗口位置未更改

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 表示 表达式 在 [placement]="top") 而我认为您的意图是使用 "top" 常量。您可以使用以下两种方法之一解决它：

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

当正确指定时，placement 选项工作得很好，如这个 plunker 所示：http://plnkr.co/edit/NCNmpm3tlxapH4jZS08F?p=preview

ng-bootstrap 日期选择器弹出窗口位置未更改

ng-bootstrap datepicker popup placement not changing

datepicker

ng-bootstrap