angular 的时间转换管道

Question

我希望在使用 angular 对象渲染时将时间戳转换为 HTML 我有一个对象，我得到开始和结束时间为 09:15:00 和 13:20:45 我想在 html

中使用管道将它们转换为 09:15 am 和 13:20 pm

<div>{{start_time}} {{end_time}}</div>

09:15:00 13:20:45

我如何使用 angular 管道实现这一点，因为我不能在这里使用日期管道，因为只有当我们在对象中有日期时它才有效我如何使用 angular 管道实现这一点，因为我不能在这里使用日期管道，因为只有当我们在对象

中有日期时才有效

谁能帮忙...

Answer 1

您可以尝试将您的时间戳转换为日期

new Date(timestamp)

然后尝试使用数据 PIPE

Answer 2

import * as moment from 'moment';

@Pipe({
  name: 'customTimePipe'
})
export class CustomTimePipe implements PipeTransform {
  transform(value: any, args?: any): any {
    return moment(value,'HH:mm').format("HH:mm A");
  }
}

这是管道文件

以后在HTML

中必须这样使用

<div>{{start_time | customTimePipe}} {{end_time | customTimePipe}}</div>

希望这能解决您的问题。

Answer 3

您可以创建自定义 'time converting' pipe.

import { Pipe, PipeTransform } from '@angular/core';
import moment = require('moment');
@Pipe({name: 'datepipe'})
export class datepipe implements PipeTransform{

    transform(value:any, args:any){

        return moment(value,'HH:mm').format("HH:mm A");

    }

}

并在显示时使用此管道。

{{start_time | datepipe}}  {{end_time | datepipe}}

DEMO

angular 的时间转换管道

Time converting pipe for angular

javascript

angular6