如何从button元素创建ng-bootstrap日期范围选择器弹出窗口

Question

我正在尝试为daterangepicker添加功能，以允许根据所选的日期范围过滤项目列表。

我希望合并以下功能：

1. 有一个显示“过滤器”的按钮。没有输入。

2. 用户可以点击该按钮，然后打开显示2个月的日历 - 当前和下一个。

3. 然后，用户可以选择日期范围。

4. 然后，所选日期范围将成为按钮的标签，向用户显示他或她所选择的内容。

这项功能可行吗？当我尝试在按钮上添加日历时，它会完全中断。当我使用输入弹出日历时，它只允许我选择开始日期，然后关闭。

这就是我的目标：

<button #dp ngModel (click)="d.toggle()" (ngModelChange)="onDateChange($event)" [displayMonths]="2" [dayTemplate]="t" ngbDatepicker #d="ngbDatepicker">
         Click Me
</button>


<ng-template #t let-date="date" let-focused="focused">
    <span class="custom-day"
    [class.focused]="focused"
    [class.range]="isFrom(date) || isTo(date) || isInside(date) || isHovered(date)"
    [class.faded]="isHovered(date) || isInside(date)"
    (mouseenter)="hoveredDate = date"
    (mouseleave)="hoveredDate = null">
    {{ date.day }}
</ng-template>

由于