Time Ago web component
Framework-independent Time Ago "pipe." Web component that works with Ionic, Angular, React, Vue, vanilla Javascript, etc. Built with Stencil.js and date-fns.
Installation
npm install time-ago-web-component --save
Sample Usage
Aquinas died <time-ago time="7 January 1274"></time-ago>. // in template
Aquinas died about 744 years ago. // output
You can also use your framework to bind a variable to time
. The input to time
can be a Date, string or number. The syntax varies by framework. To use Angular as an example:
now = new Date(); // Typescript
You entered this page <time-ago [time]="now" // in template
seconds="true"></time-ago>.
You entered this page less than 5 seconds ago. // output (updates automatically)
Options
seconds
Boolean flag, default value false. If you set it to true, the time-ago expression will include seconds when appropriate.
append
String, default value ' ago'. The value of append will be appended to the time-ago expression.
prepend
String, default value is the empty string. The value of prepend will be prepended to the time-ago expression.
Setup
Setup varies depending on which framework you are using. See the Setup Page on Github for details.