如何在单击日期选择器文本框以打开日期选择器时显示在ngx-bootstrap中选择的今天日期

Question

我想在ngx-bootstrap日期选择器打开时选择今天的日期。

Answer 1

Appart绑定。如果您只是想保留今天的日期，可以根据documentation定义一个自定义的CSS类：

.custom-today-class{ background-color:blue; }

然后在bsConfig属性中指定它：

 <input type="text"  bsDatepicker  [bsConfig]="{ customTodayClass:'custom-today-class' }"  />

Answer 2

在component.ts中，您可以执行以下操作：

import { Component } from '@angular/core';

@Component({
  selector: 'YOUR_FILE',
  templateUrl: './YOUR_FILE.html'
})
export class DemoDatePickerPopupComponent {

  bsValue: Date = new Date();
}

在您的HTML中，您可以

<div class="row">
  <div class="col-xs-12 col-12 col-md-4 form-group">
    <input type="text"
           class="form-control"
           #dp="bsDatepicker"
           bsDatepicker [(bsValue)]="bsValue">
  </div>

  <div class="col-xs-12 col-12 col-md-3 form-group">
    <button class="btn btn-success" (click)="dp.toggle()">Date Picker</button>
  </div>

</div>