0

有没有简单的方法在我的日期和时间之间添加“at”这个词，所以它看起来像这样：2015 年 1 月 20 日上午 11:49，而不是 2015 年 1 月 20 日上午 11:49。我试过了long，full但我不想显示秒数和语言环境。

    2015-01-20 16:49:07+00:00

{{ myDate | date : 'medium' }}
4

1 回答 1

2

您可以通过添加新的Custom Pipe或处理您DatePipe (Angular built-in)的组件

附上Stackblitz Demo供您参考

方法 #1 - 自定义管道

@Pipe({
  name: 'dateAtInsert'
})
export class DateAtInsertPipe implements PipeTransform {

  transform(value: string) {
    return value
      .replace(/,\s(?=\d+:)/g, ' ')
      .split(/\s(?=\d+:)/g)
      .join(' at ');
  }

}

{{ today | date : dateFormat | datAtInsert }}       // Dec 8, 2020 at 8:26 AM

方法 #2 - 组件中的日期管道

const today = new Date();
const transformDate = this.datePipe.transform(today, this.dateFormat);

this.formattedDate = transformDate
   .replace(/,\s(?=\d+:)/g, ' ')
   .split(/\s(?=\d+:)/g)
   .join(' at ');

<h1>{{ formattedDate }}<h1>             // Dec 8, 2020 at 8:26 AM

方法 #3 -at在日期格式中添加（组件中的 DatePipe）

dateFormat: string = 'MMM d, y AT h:mm a';        // Need to use an uppercase AT since lowercase "a" is reserved with AM/PM in date formats
                                                  // While capital "A" and "T" doesn't hold any value in date formats so it's safe to use


const transformDate = this.datePipe.transform(this.today, this.dateFormat);

this.formattedDate = transformDate.replace('AT', 'at');

方法 #4 -at在日期格式中添加（HTML 中的 DatePipe）

模板

{{ insertDateAt(today | date: 'MMM d, y AT h:mm a') }}

零件

insertDateAt(date: string): string {
  return date.replace('AT', 'at');
}

笔记：

  • 如果您希望您的时间采用这样的格式，请11:49 AM避免使用medium，因为它包括秒数，例如11:49:29 AM
  • 改用自定义格式，在我们使用的例子中， 或者您可以在Angular 的 DatePipe 文档MMM d, y, h:mm a中找到更多格式
于 2020-12-08T00:39:42.170 回答