CODEWITHSUNDEEP
angularjsangularjs-ng-repeat
sstrick
sstrick

Reputation: 33

Angular ng-repeat date formatting

I am using angular ng-repeat to display an array of data including some columns which are dates but what is the best way to format the dates so they are presentable to the user? Thank you in advance.

DATES LOOK LIKE THIS IN VIEW 2016-01-14T08:00:00.000Z

WANT THIS FORMAT January 14, 2016

<td width="65%" class="joinedDate">{{user.created_at}}</td>

Upvotes: 2

Views: 15411

Answers (4)

Vipin Jain
Vipin Jain

Reputation: 3756

if you format like your date (January 14, 2016) you can use 

<td width="65%" class="joinedDate">{{user.created_at | date:'MMMM dd, yyyy'  }}</td>

OR

using date : 'medium' default date time like Oct 29, 2010 9:10:23 AM

<td width="65%" class="joinedDate">{{user.created_at |date:'medium'}}</td>

for more know https://docs.angularjs.org/api/ng/filter/date

Upvotes: 7

Shrikant
Shrikant

Reputation: 538

here is more about date filter 

<td width="65%" class="joinedDate">{{ user.created_at | date:'MMMM dd, yyyy'}}</td>

Upvotes: 0

Vinay Prajapati
Vinay Prajapati

Reputation: 7524

Below are some samples:

 <span ng-non-bindable>{{1288323623006 | date:'medium'}}</span>:
 <span>{{1288323623006 | date:'medium'}}</span><br>
 <span ng-non-bindable>{{1288323623006 | date:'yyyy-MM-dd HH:mm:ss Z'}}</span>:
 <span>{{1288323623006 | date:'yyyy-MM-dd HH:mm:ss Z'}}</span><br>
 <span ng-non-bindable>{{1288323623006 | date:'MM/dd/yyyy @ h:mma'}}</span>:
 <span>{{'1288323623006' | date:'MM/dd/yyyy @ h:mma'}}</span><br>
 <span ng-non-bindable>{{1288323623006 | date:"MM/dd/yyyy 'at' h:mma"}}</span>:
 <span>{{'1288323623006' | date:"MM/dd/yyyy 'at' h:mma"}}</span>

See this for more.

Hope it helps

Upvotes: 1

Anik Islam Abhi
Anik Islam Abhi

Reputation: 25352

You can use date filter

Try like this

<td width="65%" class="joinedDate">{{user.created_at | date:'MMM dd, yyyy'  }}</td>

DEMO

Upvotes: 1

Related Questions