feat(router): support navigating by url tree

This commit is contained in:
vsavkin 2016-06-15 08:30:49 -07:00
parent cca9a58ded
commit 2aa19fd078
2 changed files with 30 additions and 25 deletions

View File

@ -1,6 +1,7 @@
import {Directive, HostBinding, HostListener, Input, OnChanges} from '@angular/core'; import {Directive, HostBinding, HostListener, Input, OnChanges} from '@angular/core';
import {Router} from '../router'; import {Router} from '../router';
import {UrlTree} from '../url_tree';
import {ActivatedRoute} from '../router_state'; import {ActivatedRoute} from '../router_state';
@ -39,6 +40,8 @@ export class RouterLink implements OnChanges {
// the url displayed on the anchor element. // the url displayed on the anchor element.
@HostBinding() href: string; @HostBinding() href: string;
private urlTree: UrlTree;
/** /**
* @internal * @internal
*/ */
@ -59,20 +62,18 @@ export class RouterLink implements OnChanges {
onClick(): boolean { onClick(): boolean {
// If no target, or if target is _self, prevent default browser behavior // If no target, or if target is _self, prevent default browser behavior
if (!(typeof this.target === 'string') || this.target == '_self') { if (!(typeof this.target === 'string') || this.target == '_self') {
this.router.navigate( this.router.navigateByUrl(this.urlTree);
this.commands,
{relativeTo: this.route, queryParams: this.queryParams, fragment: this.fragment});
return false; return false;
} }
return true; return true;
} }
private updateTargetUrlAndHref(): void { private updateTargetUrlAndHref(): void {
const tree = this.router.createUrlTree( this.urlTree = this.router.createUrlTree(
this.commands, this.commands,
{relativeTo: this.route, queryParams: this.queryParams, fragment: this.fragment}); {relativeTo: this.route, queryParams: this.queryParams, fragment: this.fragment});
if (tree) { if (this.urlTree) {
this.href = this.router.serializeUrl(tree); this.href = this.router.serializeUrl(this.urlTree);
} }
} }
} }

View File

@ -135,25 +135,6 @@ export class Router {
*/ */
get events(): Observable<Event> { return this.routerEvents; } get events(): Observable<Event> { return this.routerEvents; }
/**
* Navigate based on the provided url. This navigation is always absolute.
*
* Returns a promise that:
* - is resolved with 'true' when navigation succeeds
* - is resolved with 'false' when navigation fails
* - is rejected when an error happens
*
* ### Usage
*
* ```
* router.navigateByUrl("/team/33/user/11");
* ```
*/
navigateByUrl(url: string): Promise<boolean> {
const urlTree = this.urlSerializer.parse(url);
return this.scheduleNavigation(urlTree, false);
}
/** /**
* Resets the configuration used for navigation and generating links. * Resets the configuration used for navigation and generating links.
* *
@ -212,6 +193,29 @@ export class Router {
return createUrlTree(a, this.currentUrlTree, commands, queryParams, fragment); return createUrlTree(a, this.currentUrlTree, commands, queryParams, fragment);
} }
/**
* Navigate based on the provided url. This navigation is always absolute.
*
* Returns a promise that:
* - is resolved with 'true' when navigation succeeds
* - is resolved with 'false' when navigation fails
* - is rejected when an error happens
*
* ### Usage
*
* ```
* router.navigateByUrl("/team/33/user/11");
* ```
*/
navigateByUrl(url: string|UrlTree): Promise<boolean> {
if (url instanceof UrlTree) {
return this.scheduleNavigation(url, false);
} else {
const urlTree = this.urlSerializer.parse(url);
return this.scheduleNavigation(urlTree, false);
}
}
/** /**
* Navigate based on the provided array of commands and a starting point. * Navigate based on the provided array of commands and a starting point.
* If no starting route is provided, the navigation is absolute. * If no starting route is provided, the navigation is absolute.