angular-cn/modules/@angular/router/src/router_state.ts

243 lines
6.7 KiB
TypeScript
Raw Normal View History

/**
* @license
* Copyright Google Inc. All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
2016-06-08 14:13:41 -04:00
import {ComponentFactory, Type} from '@angular/core';
import {BehaviorSubject} from 'rxjs/BehaviorSubject';
import {Observable} from 'rxjs/Observable';
import {Data, ResolveData, Route} from './config';
2016-06-08 14:13:41 -04:00
import {PRIMARY_OUTLET, Params} from './shared';
import {UrlSegment, UrlSegmentGroup, UrlTree} from './url_tree';
import {merge, shallowEqual, shallowEqualArrays} from './utils/collection';
2016-06-08 14:13:41 -04:00
import {Tree, TreeNode} from './utils/tree';
2016-05-23 19:14:23 -04:00
2016-05-24 16:41:37 -04:00
/**
* The state of the router.
2016-05-24 16:41:37 -04:00
*
* ### Usage
*
* ```
* class MyComponent {
* constructor(router: Router) {
* const state = router.routerState;
* const id: Observable<string> = state.firstChild(state.root).params.map(p => p.id);
* const isDebug: Observable<string> = state.queryParams.map(q => q.debug);
* }
* }
* ```
*
2016-06-28 17:49:29 -04:00
* @stable
2016-05-24 16:41:37 -04:00
*/
2016-05-23 19:14:23 -04:00
export class RouterState extends Tree<ActivatedRoute> {
/**
* @internal
*/
2016-06-08 14:13:41 -04:00
constructor(
root: TreeNode<ActivatedRoute>, public queryParams: Observable<Params>,
public fragment: Observable<string>, public snapshot: RouterStateSnapshot) {
2016-05-23 19:14:23 -04:00
super(root);
}
2016-06-09 17:33:09 -04:00
toString(): string { return this.snapshot.toString(); }
2016-05-23 19:14:23 -04:00
}
2016-06-14 17:55:59 -04:00
export function createEmptyState(urlTree: UrlTree, rootComponent: Type): RouterState {
const snapshot = createEmptyStateSnapshot(urlTree, rootComponent);
const emptyUrl = new BehaviorSubject([new UrlSegment('', {})]);
2016-05-23 19:14:23 -04:00
const emptyParams = new BehaviorSubject({});
const emptyData = new BehaviorSubject({});
2016-05-23 19:14:23 -04:00
const emptyQueryParams = new BehaviorSubject({});
2016-06-08 14:13:41 -04:00
const fragment = new BehaviorSubject('');
const activated = new ActivatedRoute(
emptyUrl, emptyParams, emptyData, PRIMARY_OUTLET, rootComponent, snapshot.root);
2016-06-02 17:44:57 -04:00
activated.snapshot = snapshot.root;
2016-06-08 14:13:41 -04:00
return new RouterState(
new TreeNode<ActivatedRoute>(activated, []), emptyQueryParams, fragment, snapshot);
2016-05-23 19:14:23 -04:00
}
2016-06-14 17:55:59 -04:00
function createEmptyStateSnapshot(urlTree: UrlTree, rootComponent: Type): RouterStateSnapshot {
2016-06-01 16:29:02 -04:00
const emptyParams = {};
const emptyData = {};
2016-06-01 16:29:02 -04:00
const emptyQueryParams = {};
2016-06-08 14:13:41 -04:00
const fragment = '';
const activated = new ActivatedRouteSnapshot(
[], emptyParams, emptyData, PRIMARY_OUTLET, rootComponent, null, urlTree.root, -1,
InheritedResolve.empty);
2016-06-08 14:13:41 -04:00
return new RouterStateSnapshot(
2016-06-14 17:55:59 -04:00
'', new TreeNode<ActivatedRouteSnapshot>(activated, []), emptyQueryParams, fragment);
2016-06-01 16:29:02 -04:00
}
2016-05-24 16:41:37 -04:00
/**
2016-06-08 14:13:41 -04:00
* Contains the information about a component loaded in an outlet. The information is provided
2016-06-28 17:49:29 -04:00
* through the params, urlSegments, and data observables.
2016-05-24 16:41:37 -04:00
*
* ### Usage
*
* ```
* class MyComponent {
* constructor(route: ActivatedRoute) {
* const id: Observable<string> = route.params.map(p => p.id);
2016-06-28 17:49:29 -04:00
* const data = route.data.map(d => d.user); //includes `data` and `resolve`
2016-05-24 16:41:37 -04:00
* }
* }
* ```
*
2016-06-28 17:49:29 -04:00
* @stable
2016-05-24 16:41:37 -04:00
*/
2016-05-23 19:14:23 -04:00
export class ActivatedRoute {
2016-06-02 17:44:57 -04:00
/** @internal */
_futureSnapshot: ActivatedRouteSnapshot;
snapshot: ActivatedRouteSnapshot;
/**
* @internal
*/
2016-06-08 14:13:41 -04:00
constructor(
public url: Observable<UrlSegment[]>, public params: Observable<Params>,
public data: Observable<Data>, public outlet: string, public component: Type|string,
2016-06-08 14:13:41 -04:00
futureSnapshot: ActivatedRouteSnapshot) {
2016-06-02 17:44:57 -04:00
this._futureSnapshot = futureSnapshot;
}
toString(): string {
return this.snapshot ? this.snapshot.toString() : `Future(${this._futureSnapshot})`;
}
2016-06-01 16:29:02 -04:00
}
2016-06-28 17:49:29 -04:00
/**
* @internal
*/
export class InheritedResolve {
/**
* @internal
*/
resolvedData = {};
constructor(public parent: InheritedResolve, public current: ResolveData) {}
/**
* @internal
*/
get flattenedResolvedData(): Data {
return this.parent ? merge(this.parent.flattenedResolvedData, this.resolvedData) :
this.resolvedData;
}
static get empty(): InheritedResolve { return new InheritedResolve(null, {}); }
}
/**
* Contains the information about a component loaded in an outlet at a particular moment in time.
*
* ### Usage
*
* ```
* class MyComponent {
* constructor(route: ActivatedRoute) {
* const id: string = route.snapshot.params.id;
2016-06-28 17:49:29 -04:00
* const data = route.snapshot.data;
* }
* }
* ```
*
2016-06-28 17:49:29 -04:00
* @stable
*/
export class ActivatedRouteSnapshot {
2016-06-01 16:29:02 -04:00
/**
* @internal
*/
_resolvedComponentFactory: ComponentFactory<any>;
2016-06-08 14:13:41 -04:00
2016-06-01 16:29:02 -04:00
/** @internal **/
_routeConfig: Route;
2016-06-01 16:29:02 -04:00
2016-06-02 14:30:38 -04:00
/** @internal **/
_urlSegment: UrlSegmentGroup;
2016-06-14 17:55:59 -04:00
/** @internal */
2016-06-14 17:55:59 -04:00
_lastPathIndex: number;
2016-06-02 14:30:38 -04:00
/** @internal */
_resolve: InheritedResolve;
/**
* @internal
*/
2016-06-08 14:13:41 -04:00
constructor(
public url: UrlSegment[], public params: Params, public data: Data, public outlet: string,
public component: Type|string, routeConfig: Route, urlSegment: UrlSegmentGroup,
lastPathIndex: number, resolve: InheritedResolve) {
2016-06-01 16:29:02 -04:00
this._routeConfig = routeConfig;
2016-06-14 17:55:59 -04:00
this._urlSegment = urlSegment;
this._lastPathIndex = lastPathIndex;
this._resolve = resolve;
2016-06-01 16:29:02 -04:00
}
toString(): string {
2016-06-14 17:55:59 -04:00
const url = this.url.map(s => s.toString()).join('/');
const matched = this._routeConfig ? this._routeConfig.path : '';
return `Route(url:'${url}', path:'${matched}')`;
}
2016-06-01 16:29:02 -04:00
}
/**
* The state of the router at a particular moment in time.
*
* ### Usage
*
* ```
* class MyComponent {
* constructor(router: Router) {
* const snapshot = router.routerState.snapshot;
* }
* }
* ```
*
2016-06-28 17:49:29 -04:00
* @stable
*/
export class RouterStateSnapshot extends Tree<ActivatedRouteSnapshot> {
/**
* @internal
*/
2016-06-08 14:13:41 -04:00
constructor(
2016-06-14 17:55:59 -04:00
public url: string, root: TreeNode<ActivatedRouteSnapshot>, public queryParams: Params,
public fragment: string) {
2016-06-01 16:29:02 -04:00
super(root);
}
2016-06-09 17:33:09 -04:00
toString(): string { return serializeNode(this._root); }
2016-06-02 17:44:57 -04:00
}
function serializeNode(node: TreeNode<ActivatedRouteSnapshot>): string {
const c = node.children.length > 0 ? ` { ${node.children.map(serializeNode).join(", ")} } ` : '';
return `${node.value}${c}`;
}
2016-06-02 17:44:57 -04:00
/**
* The expectation is that the activate route is created with the right set of parameters.
* So we push new values into the observables only when they are not the initial values.
* And we detect that by checking if the snapshot field is set.
*/
export function advanceActivatedRoute(route: ActivatedRoute): void {
if (route.snapshot) {
if (!shallowEqual(route.snapshot.params, route._futureSnapshot.params)) {
(<any>route.params).next(route._futureSnapshot.params);
(<any>route.data).next(route._futureSnapshot.data);
}
if (!shallowEqualArrays(route.snapshot.url, route._futureSnapshot.url)) {
(<any>route.url).next(route._futureSnapshot.url);
}
2016-06-02 17:44:57 -04:00
route.snapshot = route._futureSnapshot;
} else {
route.snapshot = route._futureSnapshot;
(<any>route.data).next(route._futureSnapshot.data);
2016-06-02 17:44:57 -04:00
}
}