包含 Angular 2+ 日期管道格式的文本

Question

我正在尝试在 Angular 中使用 DatePipe 2. 我希望输出日期的格式为：08/23/2017 at 11:07 AM.

但是，我想不出在我的日期格式中包含文本 at 的正确方法。

当我这样指定格式时：{{my_date | date:'MM/dd/yyyy at hh:mm a'}}

我得到：08/23/2017 AMt 11:07 AM.

我尝试用引号将文本括起来：{{my_date | date:'MM/dd/yyyy "at" hh:mm a'}}

但这只是将引号添加到输出中：08/23/2017 "AMt" 11:07 AM.

唯一的方法是将它分成两个独立的管道，两侧的格式如 {{my_date | date: 'MM/dd/yyyy}} at {{my_date | date: 'hh:mm a'}} 吗？

或者有没有办法转义 at 中的 a 以便显示文本 at 而不是 AMt？

Answer 1

也许你可以创建一个简单的管道，

@Pipe({
    name: 'dateFormatPipe',
})
export class dateFormatPipe implements PipeTransform {
    transform(value: string) {
       var datePipe = new DatePipe("en-US");
        value = datePipe.transform(value, 'MMM-dd-yyyy') + ' at ' + datePipe.transform(value, 'hh:mm a');
        return value;
    }

}

<p>{{currentTime | dateFormatPipe}}</p>

Ref1 , Ref2

Answer 2

我遇到过这种情况。我能够通过用 \'

围绕文字文本来让它工作

{{my_date | date: 'yyyy/MM/dd \'at\' HH:mm:ss'}}

包含 Angular 2+ 日期管道格式的文本

Include text in Angular 2+ Date Pipe format

pipe

date-pipe

angular