How to format a date in AngularJS (Datefilter)

Question

I need to format a date with the AngularJS date-filter. Unformatted the date looks like this:

2017-03-02T00:00:00.000Z

What I want to achieve:

03/02/2017

I use the date-filter like this:

<p data-ng-bind="selectedEvent.start" | date:'MM/dd/yyyy'>{{selectedEvent.start}}</p>

And this is what I get:

Thu Mar 02 2017 00:00:00 GMT+0000

What am I doing wrong?

rrd · Accepted Answer · 2017-03-02 13:19:35Z

2

You're right and wrong.

<p data-ng-bind="selectedEvent.start | date: 'MM/dd/yyyy'"></p>

You were binding the date, but then had the filtering outside the quote. Then you had the double braces inside the

too, which was a duplicate.

answered Mar 2, 2017 at 12:31

rrd

5,9873 gold badges32 silver badges37 bronze badges

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

1 Comment

Oh.. Ok, I fixed the error but I still get this unwanted format: Wed Mar 01 2017 00:00:00 GMT+0000

Bjarne Gerhardt-Pedersen · Accepted Answer · 2017-03-02 12:37:18Z

1

You are closing your model value before adding the filter. Instead of writing

<p data-ng-bind="selectedEvent.start" | date:'MM/dd/yyyy'>{{selectedEvent.start}}</p>

Write this

<p data-ng-bind="selectedEvent.start | date:'MM/dd/yyyy'"></p>

And you dont need {{}} afterwards, since you are binding the value already.

answered Mar 2, 2017 at 12:37

1,14413 silver badges20 bronze badges

Oh.. Ok, I fixed the error but I still get this unwanted format: Wed Mar 01 2017 00:00:00 GMT+0000

@Codehan Go through the link docs.angularjs.org/api/ng/filter/date and you can find any format you want.

@Shiva nope, i always get the wrong format even if I use the right filter..