JSPM

time-ago-web-component

1.2.2
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 11
  • Score
    100M100P100Q35558F
  • License MIT

Framework-independent Time Ago "pipe." Web component that works with Ionic, Angular, React, Vue, vanilla Javascript, etc. Built with Stencil.js and date-fns.

Package Exports

  • time-ago-web-component

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (time-ago-web-component) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

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.