如何在动态生成的mat-table中将字符串转换为类型日期

Question

我有一个mat-table，它显示Date Date，Before Time Period和After Time Period之后的列。 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代码：

columnsToDisplay = [
    'executionDate',
    'previousTimePeriod',
    'afterTimePeriod'
];
executionDate: string = new Date().toISOString().slice(0, 10);

如果我使用管道{{ element[column] | date: 'yyyy-MM-dd'}} {{ element[column] | date: 'yyyy-MM-dd'}}显示类型字符串到日期类型的日期然后我无法看到时间段之前和之后。 如何仅将日期视为'yyyy-MM-dd'

Answer 1

创建一个管道：

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>  

你需要这个方法的时刻 ，请看这里更多的格式

Answer 2

我的建议是使用角度矩

所以你可以使用它的过滤器很简单

{{ element[column] | amParse: 'YYYY-MM-DDTHH:mm:ss.SSSSZ' | amDateFormat: 'yyyy-MM-dd' }}

Answer 3

另一个想法是你可以将你的字符串日期转换为'yyyy-MM-dd'格式，并替换为使用string-date替换。

这个链接可以帮到你。