ui-router-rx
Reactive Extensions (RxJS) for UI-Router
What
This UI-Router plugin exposes various events in UI-Router as RxJS Observables.
- Transitions (successfull, or any)
- Parameter values
- State registration/deregistrations
This helps you to use UI-Router in a reactive mode.
This plugin works with UI-Router Core 2.0 and above (angular-ui-router 1.0.0-rc.1+, ui-router-ng2 1.0.0-beta.4+, ui-router-react 0.4.0+).
Getting
npm install ui-router-rx
Enabling
This is a UI-Router Plugin.
Add the UIRouterRx
plugin to your app's UIRouter
instance.
; // ... after UI-Router bootstrap, get a reference to the `UIRouter` instance// ... call `.plugin()` to register the ui-router-rx pluginuiRouter;
Using
In a state definition,
const foo$ = uiRouterglobalsparams$ var fooState = name: 'foo' url: '/foo/{fooId}' component: FooComponent resolve: token: 'foo$' deps: UIRouter resolveFn: foo$ )
In the component, access the foo$
resolve value (it will be an Observable). Subscribe to it and do something with it when it emits a new value.
var subscription = foo$;
Don't forget to unsubscribe when the component is destroyed.
subscription;