CODEWITHSUNDEEP
angulardatetimeionic3angular5
Jishad
Jishad

Reputation: 2965

Ionic 3 - Angular 5 -- Time Format change

I am getting a response from firebase for the start timee : 16:40:12

I want to show the time in view as 04:40 PM, Searching from afternoon for a solution in google and not working properly..

Here is my code,

<div class="time">
   <div>{{ setDate(booking.start) | date:'hh:mm a' }}</div>
   <div>{{ setDate(booking.end) | date:'hh:mm a' }}</div>
 </div>

setDate(date){
  console.log(new Date(date));
  return new Date(date);
}

Upvotes: 0

Views: 353

Answers (1)

Pardeep Jain
Pardeep Jain

Reputation: 86800

Just convert your 24H format into 12 Hour one, You can use custom method.

Here is an example 

function tConvert (time) {
  // Check correct time format and split into components
  time = time.toString ().match (/^([01]\d|2[0-3])(:)([0-5]\d)(:[0-5]\d)?$/) || [time];

  if (time.length > 1) { // If time format correct
    time = time.slice (1);  // Remove full string match value
    time[5] = +time[0] < 12 ? 'AM' : 'PM'; // Set AM/PM
    time[0] = +time[0] % 12 || 12; // Adjust hours
    time[0] = time[0] > 10 ? time[0] : '0'+time[0];
  }
  console.log(time.join (''));
  return time.join (''); // return adjusted time or original string
}

tConvert("16:40:42");

Upvotes: 1

Related Questions