我希望在单击按钮时显示datepicker,当我选择日期时,它应该使用角度显示在文本框中。请帮助我解决这个问题,因为在按钮上单击没有datepicker打开
<button type="button" class="btn btn-icon waves-effect waves-light btn-success"
click="getReport()">
<i class="fas fa-info-circle"></i>
</button>
<mat-form-field>
<input matInput type="text" class="form-content" id="pickDate" placeholder="Date"
[(ngModel)]="selectedFromDate" bsDatepicker [ngModelOptions]="{standalone: true}"
[bsConfig]="{ isAnimated: true,adaptivePosition: true,containerClass:'theme-red',dateInputFormat: 'MM/DD/YYYY', selectFromOtherMonth: 'true'}"
(ngModelChange)="setFromDate($event)" required autocomplete="off">
</mat-form-field>
函数调用:
async getReport() {
$(".btn-success").datepicker('show');
}
您可以在
open()
上使用MatDatepicker
方法。
<mat-form-field>
<input matInput [matDatepicker]="picker">
<mat-datepicker #picker></mat-datepicker>
</mat-form-field>
<button (click)="picker.open()">Open</button>
我在原始输入元素上遇到了类似的问题,但找不到解决方案。在此分享,以防其他人遇到同样的问题。
如果您正在使用 Typescript 并使用 HTMLInputElement 类型,并且需要在单击另一个元素时打开日期选择器,您可以通过调用该元素上的 showPicker() 方法来实现此目的,日期选择器将被打开:
const datePickerInput = document.querySelector('.input_date-picker') as HTMLInputElement;
datePickerInput.showPicker();