如何将字符串转换为动态生成的Mat表中的日期类型 [英] How to convert string to type date in dynamically generated mat-table
本文介绍了如何将字符串转换为动态生成的Mat表中的日期类型的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个垫子表,其中显示列日期,时间段之前和时间段之后. HTML代码:-
I have a mat-table which displays columns Date, Before Time Period and After Time Period. Code for HTML :-
<ng-container
matColumnDef="{{ column }}"
*ngFor="let column of columnsToDisplay"
>
<th mat-header-cell *matHeaderCellDef>{{ column }}</th>
<td mat-cell *matCellDef="let element">
{{ element[column] }}
</td>
</ng-container>
TypeScript代码:
TypeScript Code:
columnsToDisplay = [
'executionDate',
'previousTimePeriod',
'afterTimePeriod'
];
executionDate: string = new Date().toISOString().slice(0, 10);
如果我使用管道{{ element[column] | date: 'yyyy-MM-dd'}}
将字符串类型的日期显示为日期类型,则无法看到时间段之前和之后.
如何只将日期显示为"yyyy-MM-dd"
If I use a pipe {{ element[column] | date: 'yyyy-MM-dd'}}
to display Date of type string to date type then I am not able to see Before and After Time Period.
How can I view date only as 'yyyy-MM-dd'
推荐答案
创建管道:
import { Pipe, PipeTransform } from '@angular/core';
import * as moment from 'moment';
@Pipe({
name: 'momentPipe',
pure: false
})
export class MomentPipe implements PipeTransform {
constructor() { }
transform(value: string, dateFormat: string): any {
return moment(value).format(dateFormat);
}
}
然后使用html:
<span >{{ element[column] | momentPipe: 'dddd D MMM YYYY' }}</span>
You need moment for this approach see here more formats
这篇关于如何将字符串转换为动态生成的Mat表中的日期类型的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文