Convert Miliseconds into HH:MM:SS format in Angular 12

Question

I get the data form backend in miliseconds need to bind in hh:mm and when i bind it get a number a try a pipe for converting but didn't help

Maximum Outage Time (per Month): {{objSevrvice.MaximumOutageTimePerMonth | miliSeconds}}

Does this answer your question? [How to convert milliseconds into a readable date?](https://stackoverflow.com/questions/8579861/how-to-convert-milliseconds-into-a-readable-date) — Harshal, Jul 05 '21 at 14:35

score 2 · Answer 1 · answered Jul 05 '21 at 14:55

2

<h1>{{a|date:'HH:mm:ss'}}</h1>

  a = new Date(1625496789304);

answered Jul 05 '21 at 14:55

vueAng

415
2
7

Get Off My Lawn · Answer 2 · 2021-07-05T15:05:15.530

You can create a pipe to use throughout your html to transform string dates, milliseconds, or any valid time parameter into a date like this:

@Pipe({name: 'toDate'})
export class ToDatePipe implements PipeTransform {
  transform(value: number | string) {
    // Convert the value to a date, if the date is invalid,
    // then we return the current date/time.
    return new Date(value) || new Date()
  }
}

Next you can then use the pipe alongside Angular's date pipe in your html like this:

@Component({
  selector: 'my-component',
  template: `
    <span>{{myVale|toDate|date:'hh:mm:ss'}}</span>
  `
})
export class MyComponent implements OnInit {
  myValue = 0

  constructor(private myService: MyService){ }

  ngOnInit() {
    this.myService.getValue().subscribe(v => {
      this.myValue = v
    })
  }
}

Convert Miliseconds into HH:MM:SS format in Angular 12

2 Answers2