1.0.1 • Published 6 years ago
angular-ui-pipes v1.0.1
Angular-UI-Pipes
Going to be the most complete and easy-to-use Angular pipe collection. Require @angular/core >=4.0.0
Plan & Goal
The goal to build a set of complete and easy-to-use angular pipes to help display human-friendly data format. What we mean by 'complete' is to solve as much as angular pipes use cases as we can. Each pipe should be versatile and fully customizable with pipe parameters, also performance cost should be minimized. Our documentation should be seamless and understandable with the first glance.
Pipes | Scenario | Status |
---|---|---|
Numbers | ||
short number | 12452 => 12.4k | completed |
chinese short number | 12452 => 1.2万 | planned |
exponential | 299792458 => 3e+8 | completed |
ordinal | 2 => 2nd | completed |
percentage | 0.2 => 20% | in-progress |
Time | ||
ISO duration | 2M56.46S => 2:56.46 | completed |
duration | 200(second) => 3:20 | in-progress |
time ago | date/timestamp=>few minutes ago | completed |
time in | date/timestamp=> in 35 minutes | in-progress |
relative time | date/timestamp=>1:20/yesterday/friday | in-progress |
count down | not-planned | |
Raw Data | ||
uncamel case | fooBar => foo bar | in-progress |
dedash | foo-bar => foo bar | in-progress |
yes or no | boolean => yes/no | in-progress |
boolean | boolean => customize answers | in-progress |
object key | {foo:bar} => foo | in-progress |
url encode/decode | foo%20bar => foo bar | in-progress |
HTML | ||
parse links | google.com => <a href='google.com'>google.com</a> | planned |
new lines | foo /n bar => foo<br>bar | planned |
escape code | foo bar => foo bar | planned |
Unit Conversion | ||
disk storage | 534215 Bit => 66.78kb | planned |
Install
npm install angular-ui-pipes --save
Usage
In app.module.ts or any angular modules
import { UIPipes } from 'angular-ui-pipes';