要在不设置内置错误的情况下,为mat-date-range-input触发mat-form-field中mat-error的显示,可以通过以下步骤实现:
<mat-form-field>
<mat-date-range-input [formControl]="dateRangeControl" [rangePicker]="picker">
<input matStartDate placeholder="Start date">
<input matEndDate placeholder="End date">
</mat-date-range-input>
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-error *ngIf="dateRangeControl.invalid">Invalid date range</mat-error>
</mat-form-field>
import { FormControl, Validators } from '@angular/forms';
export class YourComponent {
dateRangeControl: FormControl;
constructor() {
this.dateRangeControl = new FormControl('', Validators.required);
}
}
这样,当用户未选择日期范围时,mat-error标签将显示错误消息。如果用户选择了有效的日期范围,mat-error标签将隐藏。
推荐的腾讯云相关产品:腾讯云云服务器(CVM)和腾讯云云数据库MySQL。您可以在腾讯云官网上找到更多关于这些产品的详细信息和介绍。
腾讯云云服务器(CVM)产品介绍链接:https://cloud.tencent.com/product/cvm
腾讯云云数据库MySQL产品介绍链接:https://cloud.tencent.com/product/cdb_mysql
没有搜到相关的沙龙
领取专属 10元无门槛券
手把手带您无忧上云