@rxjs-ninja/rxjs-utility
v5.1.3
Published
Useful utilities for RxJS
Downloads
1,018
Maintainers
Readme
RxJS Ninja - Utilities
Website | API Documentation | Changelog
@rxjs-ninja/rxjs-utility
provides operators for working with Observable values to view them, and modify them and don't
all into the other module categories.
Function and Operator categories
Conversion
Operators for converting source values using calculations such a temperture, length and weight
const source$ = from([10, 50, 100]);
// Convert the source values as Celcius temperature to Fahrenheit
source.pipe(temperature(Temperatures.CELSIUS, Temperatures.FAHRENHEIT)).subscribe();
// Output: `50, 122, 212`
// Convert the source values as Km to Miles, with `1` decimal place
source.pipe(length(Lengths.KM, Lengths.MILES, 1)).subscribe();
// Output: `6.2, 31.1, 62.1`
Colour
Operators for converting colour types
const rgb$ = from(['rgb(0, 0, 0)', 'rgb(255, 255, 255)']);
const hex$ = from(['#000000', '#ffffff']);
// Convert RGB strings to Hex
rgb$.pipe(rgbToHex()).subscribe();
// Output: `'#000000', '#ffffff'`
// Convert Hex strings to RGB
hex$.pipe(hexToRGBA()).subscribe();
// Output: `'rgb(0, 0, 0)', 'rgb(255, 255, 255)'`
HTTP
Functions for working with HTTP Observables - see Fetch With Progress Demo.
Mapping
Operators use for mapping to different values
const source$ = from([1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16]);
// Generate a FizzBuzz from the source numbers
source$.pipe(
mapIfSource<number, string, number>(
(value) => value % 15 == 0 || value % 3 == 0 || value % 5 == 0,
(value) => (value % 15 == 0 ? `FizzBuzz` : value % 3 === 0 ? 'Fizz' : 'Buzz'),
(value) => value,
),
);
// Output: `1, 2, 'Fizz', 4, 'Buzz', 'Fizz', 7, 8, 'Fizz', 'Buzz', 11, 'Fizz', 13, 14, 'Fizz' 'Buzz'`
Side Effects
Operators for handling side effects on different events or conditions
const inputObs$ = fromEvent(document, 'click').pipe(
startWithTap(() => console.log('This will only fire once')),
tapOnSubscribe(() => console.log('This will tab on every subscribe')),
tapIf(
(event) => event.target.id === 'some-div',
() => console.log('This will tap if the user clicks on the target element'),
),
);
inputObs$.subscribe(); // This will only fire once, This will tab on every subscribe
inputObs$.subscribe(); // This will tab on every subscribe
Streams
Operators and Functions for working with other types of streams of data. See Demos: