once-upon-a-pipe is a simple Angular pipe for converting a date string into a time ago or a time from now.
| Time Range | Past Time | Future Time |
|---|---|---|
| 0 - 29 seconds | just now | X seconds from now |
| 30 - 60 seconds | 1 minute ago | 1 minute from now |
| 1 - 45 minutes | X minutes ago | X minutes from now |
| 45 - 90 minutes | 1 hour ago | 1 hour from now |
| 90 minutes - 22 hours | X hours ago | X hours from now |
| 22 - 36 hours | 1 day ago | 1 day from now |
| 36 hours - 25 days | X days ago | X days from now |
| 25 - 45 days | 1 month ago | 1 month from now |
| 45 - 345 days | X months ago | X months from now |
| 345 - 545 days (1.5 years) | 1 year ago | 1 year from now |
| 546 days+ | X years ago | X years from now |
npm i once-upon-a-pipe --save
You need to import the OnceUponAPipeModule by adding the following lines to your app.module.ts file.
import { OnceUponAPipeModule } from 'once-upon-a-pipe';
@NgModule({
imports: [OnceUponAPipeModule]
})
export class AppModule { }In your component templates you can just do:
<p>{{ my_date | onceUponAPipe}}</p>where my_date is a local date string, which could be parsed by the standard Js Date().
If this value is null or not parsable as a date, then the pipe will display nothing.