bsDatepicker 中的今天按钮答案

【问题标题】：Today's Button in bsDatepickerbsDatepicker 中的今天按钮
【发布时间】：2018-05-02 20:58:41
【问题描述】：

我们能否在日历上设置一个“今天”按钮，以便当我们单击该按钮时，将日历重置为今天的日期？

我正在关注这个教程https://valor-software.com/ngx-bootstrap/#/datepicker#config-object

【问题讨论】：

你能提供你到目前为止所做的事情吗？似乎您要求我们为您编写代码。请参阅How to Ask 和minimal reproducible example，如果您还没有，可以选择tour。
我导入为： import { NgbModule } from '@ng-bootstrap/ng-bootstrap';它给了我很好的日历日期选择器。默认情况下，它上面没有“今天”按钮。有没有办法，我们也可以使用带有今天按钮的日期选择器。
您需要将今天按钮添加到日期选择器中，还是可以将其分开？
我想将“今天”按钮添加到日期选择器中

【解决方案1】：

<div class="col-xs-12 col-12 col-md-4 form-group">

      <input type="text"
             class="form-control"
             [(ngModel)]="bsValue"
             #dp="bsDatepicker"
             bsDatepicker
             [bsValue]="bsValue"
             [bsConfig]="bsConfig"
             (ngModelChange)="emitSelectedDate()">

      <button class="btn btn-outline-secondary" (click)="dp.toggle()" type="button" [attr.aria-expanded]="dp.isOpen">

      </button>

在组件中

我从 '@ng-bootstrap/ng-bootstrap' 导入为 import { NgbModule }；

及以下代码

bsValue = new Date();
  selectedDate: any;

  bsConfig: Partial<BsDatepickerConfig> ;


  constructor() { 
    this.bsConfig = Object.assign({}, { containerClass: this.colorTheme });
    this.bsConfig = Object.assign({}, { showWeekNumbers: false }); 
    // this.bsConfig = Object.assign({}, { todayBtn: true }); 

 }

我试图将 TodayBtn 设为 true，但没有这样的属性。我有一个不错的日历，但想在日历上有一个“今天”按钮，它将日历重置为今天的日期。

【讨论】：

【解决方案2】：

我已经解决了这个要求，你可以查看这个活生生的例子 https://stackblitz.com/edit/ngx-bootstrap-date-picker-add-custom-content

ngx-bootstrap 不提供在日期选择器弹出窗口中添加自定义内容的任何工具。但是我们可以动态地向其中添加内容，添加后我使用 RxJS fromEvent 方法来填充事件。一旦我们得到点击事件，我们就可以在其中添加逻辑。

这里我添加了三个示例按钮，它们分别是 Today、Reset 和 Close 按钮供您参考。

请点击“今天”按钮获取答案。

【讨论】：