我正在使用Angular 2材质的DatePicker组件here,并且我希望能够动态设置显示格式(例如YYYY-MM-DD或DD-MM-YYYY等)
似乎有一种方法可以通过覆盖使用的“日期适配器”在全球范围内扩展,但这对我不起作用,因为我可能需要不同的日期时间选择器才能使用不同的格式。我无法全局设置。有任何已知的解决方法吗?
您可以创建另一个输入,以显示格式化的日期值。在您的html中为ngModel
和matDatepicker
创建一个输入,并为显示格式化的日期值创建另一个输入。
<div style="position: relative">
<!-- display formatted value -->
<mat-form-field>
<input
matInput
[value]="currentDate | dateFilter: dateFormat"
[placeholder]="label"
autocomplete="off"
/>
<!--shadow input keep ngModel value-->
<input
[matDatepicker]="picker"
[(ngModel)]="value"
class="shadow-dateInput"
/>
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field>
</div>
这是Stackblitz上的有效示例