fix(router): handle router outlets in ngIf
This commit is contained in:
@ -123,6 +123,7 @@ export class Router {
|
||||
private routerEvents: Subject<Event>;
|
||||
private navigationId: number = 0;
|
||||
private config: RouterConfig;
|
||||
private futureUrlTree: UrlTree;
|
||||
|
||||
/**
|
||||
* Creates the router service.
|
||||
@ -134,6 +135,7 @@ export class Router {
|
||||
this.resetConfig(config);
|
||||
this.routerEvents = new Subject<Event>();
|
||||
this.currentUrlTree = createEmptyUrlTree();
|
||||
this.futureUrlTree = this.currentUrlTree;
|
||||
this.currentRouterState = createEmptyState(this.currentUrlTree, this.rootComponentType);
|
||||
}
|
||||
|
||||
@ -221,6 +223,18 @@ export class Router {
|
||||
return createUrlTree(a, this.currentUrlTree, commands, queryParams, fragment);
|
||||
}
|
||||
|
||||
/**
|
||||
* Used by RouterLinkWithHref to update HREFs.
|
||||
* We have to use the futureUrl because we run change detection ind the middle of activation when
|
||||
* the current url has not been updated yet.
|
||||
* @internal
|
||||
*/
|
||||
createUrlTreeUsingFutureUrl(
|
||||
commands: any[], {relativeTo, queryParams, fragment}: NavigationExtras = {}): UrlTree {
|
||||
const a = relativeTo ? relativeTo : this.routerState.root;
|
||||
return createUrlTree(a, this.futureUrlTree, commands, queryParams, fragment);
|
||||
}
|
||||
|
||||
/**
|
||||
* Navigate based on the provided url. This navigation is always absolute.
|
||||
*
|
||||
@ -293,20 +307,21 @@ export class Router {
|
||||
}
|
||||
|
||||
return new Promise((resolvePromise, rejectPromise) => {
|
||||
let updatedUrl: UrlTree;
|
||||
let state: RouterState;
|
||||
let navigationIsSuccessful: boolean;
|
||||
let preActivation: PreActivation;
|
||||
applyRedirects(url, this.config)
|
||||
.mergeMap(u => {
|
||||
updatedUrl = u;
|
||||
this.futureUrlTree = u;
|
||||
return recognize(
|
||||
this.rootComponentType, this.config, updatedUrl, this.serializeUrl(updatedUrl));
|
||||
this.rootComponentType, this.config, this.futureUrlTree,
|
||||
this.serializeUrl(this.futureUrlTree));
|
||||
})
|
||||
|
||||
.mergeMap((newRouterStateSnapshot) => {
|
||||
this.routerEvents.next(new RoutesRecognized(
|
||||
id, this.serializeUrl(url), this.serializeUrl(updatedUrl), newRouterStateSnapshot));
|
||||
id, this.serializeUrl(url), this.serializeUrl(this.futureUrlTree),
|
||||
newRouterStateSnapshot));
|
||||
return resolve(this.resolver, newRouterStateSnapshot);
|
||||
|
||||
})
|
||||
@ -341,10 +356,10 @@ export class Router {
|
||||
|
||||
new ActivateRoutes(state, this.currentRouterState).activate(this.outletMap);
|
||||
|
||||
this.currentUrlTree = updatedUrl;
|
||||
this.currentUrlTree = this.futureUrlTree;
|
||||
this.currentRouterState = state;
|
||||
if (!preventPushState) {
|
||||
let path = this.urlSerializer.serialize(updatedUrl);
|
||||
let path = this.urlSerializer.serialize(this.futureUrlTree);
|
||||
if (this.location.isCurrentPathEqualTo(path)) {
|
||||
this.location.replaceState(path);
|
||||
} else {
|
||||
@ -355,8 +370,8 @@ export class Router {
|
||||
})
|
||||
.then(
|
||||
() => {
|
||||
this.routerEvents.next(
|
||||
new NavigationEnd(id, this.serializeUrl(url), this.serializeUrl(updatedUrl)));
|
||||
this.routerEvents.next(new NavigationEnd(
|
||||
id, this.serializeUrl(url), this.serializeUrl(this.futureUrlTree)));
|
||||
resolvePromise(navigationIsSuccessful);
|
||||
},
|
||||
e => {
|
||||
|
Reference in New Issue
Block a user