日期管隱藏零

Question

我想知道我怎麼可以修改/創建自己的管道，使：

1. 如果低於分鐘，節目秒
2. 如果低於小時，展現MM：SS
3. 如果小於1小時，顯示爲hh：mm：ss的

我知道，當我USDE：

{{ dateObj | date:'hhmmss' }}  // output is '00:00:11' when timestamp is 11s; 

Answer 1

由於Angular pipe是一個帶有一些裝飾器的JS類，你仍然可以直接使用它。你的情況，你可以實現自己的管道，將使用內置角管的方式是這樣的：

new DatePipe().transform(myDate, 'hhmmss'); 

所以，讓我們：

import { Pipe, PipeTransform } from '@angular/core'; 
import { DatePipe } from '@angular/common'; 

@Pipe({name: 'my-duration'}) 
export class MyDurationPipe implements PipeTransform { 
    transform(value: Date): string { 
    if (/* time difference is less than minute */) { // add your comparison to get minutes 
     return new DatePipe().transform(value, 'ss'); 
    } 
    else if (/* time difference is less than hour */) { // the same for hours etc. 
     return new DatePipe().transform(value, 'mm:ss'); 
    } 
    // and so on 
    } 
} 

然後你可以使用它作爲一個經常性管。