如何在使用 ngFor Angular 5 时对对象数据进行运行时操作答案

【问题标题】：How to put run time operations on object data while using ngFor Angular5如何在使用 ngFor Angular 5 时对对象数据进行运行时操作
【发布时间】：2019-02-08 12:13:56
【问题描述】：

我有这样的代码

 <div *ngFor="let oldRow of displayData">
 <span>{{ dataTime }}</span> // getting data like " Fri Aug 31 2018 15:28:34 GMT+0530 (India Standard Time) "
  </div>

我只想显示转换为 12 小时格式的时间，例如“下午 3:28”，我该如何获得它。

有什么帮助吗？谢谢

【问题讨论】：

使用Date pipe
@AlekseySolovey，有什么例子吗？
{{ dataTime | date: 'h:mm a'}}
按照@AlekseySolovey 的建议使用日期管道。

标签： angular typescript angular5 ngfor

【解决方案1】：

您需要为此编写自定义管道。

import { DatePipe } from '@angular/common';
import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'dateFormat'
})
export class DateFormatPipe extends DatePipe implements PipeTransform {
  transform(value: any, args?: any): any {
    return super.transform(value, 'dd/MMM/yyyy h:mm a');
  }
}

创建此管道后，您可以在此管道中获取该值作为参数并根据需要对其进行转换。希望这会有所帮助。

【讨论】：