Barnee
Barnee

Reputation: 3399

Angular date pipe custom output

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?

Upvotes: 3

Views: 1311

Answers (2)

Vijay Barot
Vijay Barot

Reputation: 352

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

Upvotes: 1

Marcus Hert da Coregio
Marcus Hert da Coregio

Reputation: 6308

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

Upvotes: 8

Related Questions