CODEWITHSUNDEEP
javascriptangularjsionic-framework
om_jaipur
om_jaipur

Reputation: 2196

How to display date-time in HH:MM AM format in Ionic

I have a date string "2017-01-19 10:34:36", it's coming from API.

I want to display it in HH:MM AM format in Ionic

Upvotes: 5

Views: 17610

Answers (6)

Abdul khader
Abdul khader

Reputation: 67

If you want to display as format 'dd/MM/yyyy HH:mm am/pm', just use:

{{item.createdDate | date: "dd/MM/yyyy HH:mm a"}}

Upvotes: 1

Mangesh Daundkar
Mangesh Daundkar

Reputation: 1046

Pass the date string to following function, it will return time in HH:MM AM format. 

getFormatedTime(dateString){
   var date = new Date(dateString);
   var hours = date.getHours() > 12 ? date.getHours() - 12 : date.getHours();
   var am_pm = date.getHours() >= 12 ? "pm" : "am";
   var minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
   let time = hours + ":" + minutes + " " + am_pm;
   return time;
}

Upvotes: 0

Norman Pilusa
Norman Pilusa

Reputation: 337

A good resource is the angular documentation. It is well written check it out here https://docs.angularjs.org/api/ng/filter/date

Upvotes: 1

Mavlarn
Mavlarn

Reputation: 3883

To display datetime, you can just do it in angular2 way, using a pipe. Angular2 provides a DatePipe. You can use it like this:

{{info.createdDate | date: "yyyy/MM/dd HH:mm:ss"}}

[update]

If you want to display as format 'HH:MM AM', just use:

{{info.createdDate | date: "shortTime"}}

will be fine.

Upvotes: 11

Bala Abhinav
Bala Abhinav

Reputation: 1348

If you want to "display" it in say a p tag then you can use momentJs library Otherwise, if you want to load it into the dateTime directive of ionic follow whatever kyle has posted

Upvotes: 1

Tien
Tien

Reputation: 137

You can do like this:

<ion-datetime displayFormat="hh:mm a" [(ngModel)]="myDate"></ion-datetime>

Read more here from ionic docs

Upvotes: 3

Related Questions