javascript - 在 Typescript Angular 中格式化时间

我想在我的 FormArray 中迭代 time，并且我从 API 收到的时间格式如下：

14.21.00

我想把这个时间格式化成这样：

2:21 PM

我正在尝试使用 Angular DatePipe 进行如下格式化：

{{summon.value.summonTime | date :'shortTime' }}

但是出错了：

错误：InvalidPipeArgument：无法将 "14.21.00" 转换为日期用于管道 'DatePipe'

我在 Stackblitz 中重现了这里

根据我的研究，14.21.00 不是 JavaScript/TypeScript 支持的时间格式，如果有任何指导或建议来解决这个问题。

答案＃1

试试这个（已在你的 stackblitz 代码上测试）：

time:{{'1990-10-10 '+ summon.value.summonTime.split('.').join(':') | date:'shortTime' }}

要使用“date”管道，时间也必须跟随一个日期，因此我们可以传递任何日期仅用于验证 date 管道。例如，这个可以工作：{{'1990-10-10 01:02:03' | date:'shortTime'}}，而这个则不行：{{'01:02:03' | date:'shortTime'}}。

我还用 split 和 join 将时间中的“.”（点）替换为“:”，以按需要格式化。

答案＃2

希望你一切都好！！！

在你希望的文件夹中创建一个新的管道。完成后，请在模块中提供详细信息（导入和声明）：-

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

@Pipe({
  name: 'dateTransformer'
})
export class DateTransformerPipe implements PipeTransform {

  transform(value: any, args?: any): any {
    return value && value.length > 0 ? value.replace('.', ':') : value;
  }
}

完成后，在你的代码片段中更新此内容：-

<ng-container [formGroupName]="i">
  <input type="checkbox" formControlName="isChecked" />
  {{ summon.value.summonTime | dateTransformer }}
  item: {{ summon.value.itemNo }}
  <br />
  time:{{ summon.value.summonTime | dateTransformer }}
  <br />
</ng-container>

希望我能够解决你的问题！祝编码愉快！！干杯！！！