Skip to content

Commit a68e367

Browse files
docs(UIRouterConfig): update for new NgModule paradigm
1 parent 5461764 commit a68e367

File tree

1 file changed

+35
-26
lines changed

1 file changed

+35
-26
lines changed

src/ng2/uiRouterConfig.ts

+35-26
Original file line numberDiff line numberDiff line change
@@ -1,57 +1,47 @@
11
/** @module ng2 */ /** */
22
import {UIRouter} from "../router";
33
/**
4-
* Provides states configuration to UI-Router during application bootstrap.
4+
* Configures UI-Router during application bootstrap.
55
*
6-
* An instance of this class should be `provide()`d to the application `bootstrap()`.
6+
* UI-Router ng2 users should implement this class, and pass it to [[provideUIRouter]] in the root app `NgModule`.
77
*
88
* @example
99
* ```js
10-
* import {UIROUTER_PROVIDERS, UIView} from "ui-router-ng2";
11-
* import {MyConfig} from "./app/myConfig";
10+
* import {MyUIRouterConfig} from "./app/router.config";
11+
* import {UIView} from "ui-router-ng2";
1212
*
13-
* bootstrap(UIView, [
14-
* ...UIROUTER_PROVIDERS,
15-
* provide(UIRouterConfig, { useClass: MyConfig }
16-
* ]);
13+
* @ UIRouterModule({
14+
* providers: [provideUIRouter({ configClass: MyUIRouterConfig)]
15+
* states: [state1, state2],
16+
* bootstrap: [UIView]
17+
* }) class RootAppModule {}
1718
* ```
1819
*
19-
* The application's initial states should be registered with the [[UIRouter.stateRegistry]].
2020
* Any global configuration (transition hooks, parameter types, etc) should be done here.
2121
*
2222
* @example
2323
* ```js
2424
*
25-
* // myconfig.ts
26-
* import {STATES} from "./states";
25+
* // router.config.ts
2726
* import {registerAuthHook} from "./hooks";
2827
* import {registerSlugType} from "./paramtypes";
2928
*
30-
* export class MyConfig {
29+
* export class MyUIRouterConfig {
3130
* configure(uiRouter: UIRouter) {
32-
* STATES.forEach(state => uiRouter.stateRegistry.register(state));
3331
* registerAuthHook(uiRouter.transitionService);
3432
* registerSlugType(uiRouter.urlMatcherFactory);
3533
* }
3634
* }
3735
*
38-
* // states.ts
39-
* import {FooComponent} from "./foo.component";
40-
* import {BarComponent} from "./bar.component";
41-
* import BAZ_MODULE_STATES from "./baz/states";
42-
*
43-
* export let STATES = [
44-
* { name: 'foo', url: '/url', component: FooComponent},
45-
* { name: 'bar', url: '/bar', component: BarComponent}
46-
* ].concat(BAZ_MODULE_STATES);
47-
*
4836
* // hooks.ts
4937
* export function registerAuthHook(transitionService: TransitionService) {
50-
* let requireAuthentication = (transition: Transition, injector: Injector) {
51-
* if (!Injector.get(AuthService).isAuthenticated()) {
52-
* return Injector.get(StateService).target('login');
38+
* const requireAuthentication = (transition: Transition) => {
39+
* let injector = transition.injector();
40+
* if (!injector.get(AuthService).isAuthenticated()) {
41+
* return injector.get(StateService).target('login');
5342
* }
5443
* }
44+
*
5545
* transitionService.onBefore({ to: (state) => state.requiresAuth }, requireAuthentication);
5646
* }
5747
*
@@ -64,6 +54,25 @@ import {UIRouter} from "../router";
6454
* }
6555
* ```
6656
*
57+
* Your configuration class can be injected, if necessary.
58+
* Decorate with `@Injectable` and add dependencies to the class constructor.
59+
*
60+
* ```js
61+
* @ Injectable()
62+
* export class MyConfig {
63+
* myService: MyService;
64+
*
65+
* constructor(myService: MyService) {
66+
* this.myService = myService;
67+
* }
68+
*
69+
* configure(router: UIRouter) {
70+
* // ... use this.myService
71+
* }
72+
* }
73+
* ```
74+
*
75+
*
6776
*/
6877
export class UIRouterConfig {
6978
/**

0 commit comments

Comments
 (0)