Angular date pipe custom output

Question

If you take a look in Angular's DatePipe documentation you'll see at the pre-defined format options there's a 'long' format that looks like this: June 15, 2015 at 9:03:01 AM GMT+1

I want to achieve the same thing but without the timezone. Eg: 08 August at 16:06pm

Here's my code:
{{ clicked | date: 'dd MMMM HH:mma' | lowercase }} output: 08 August 16:06pm
But how can I insert the word at between the month and hour?

As a quick fix, I've managed to do it like this:

{{ clicked  | date: 'dd MMMM' }} at {{ clicked  | date: 'HH:mma' | lowercase }}

But is there a better solution without creating a new custom pipe?

Marcus Hert da Coregio · Accepted Answer · 2018-08-17 13:43:37Z

8

Normally I do this:

{{ clicked | date: "dd MMMM 'at' HH:mma" | lowercase }}

This way with double quotes the word at inside single quotes is interpreted as a string

answered Aug 17, 2018 at 13:43

Marcus Hert da Coregio

6,4581 gold badge20 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Vijay Barot · Accepted Answer · 2018-08-17 14:01:20Z

1

Easiest way to put your custom string inside your date format just like below,

{{ clicked | date: "format'at' format" | lowercase }}

output : date at time

this way you can achieve multiple formate as you want by adding multiple custom data.

{{ clicked | date: " date format 'on' EEEE 'at' format" | lowercase }}

// EEEE for Day Name

output : date on Day Name at time

answered Aug 17, 2018 at 14:01

Vijay Barot

3523 silver badges8 bronze badges

Collectives™ on Stack Overflow

Angular date pipe custom output

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related