fix(router): wildcard don't get notified on url changes
This commit is contained in:
parent
1a145ac500
commit
54edce2bab
|
@ -13,7 +13,7 @@ import {Observable} from 'rxjs/Observable';
|
||||||
import {Route} from './config';
|
import {Route} from './config';
|
||||||
import {PRIMARY_OUTLET, Params} from './shared';
|
import {PRIMARY_OUTLET, Params} from './shared';
|
||||||
import {UrlPathWithParams, UrlSegment, UrlTree} from './url_tree';
|
import {UrlPathWithParams, UrlSegment, UrlTree} from './url_tree';
|
||||||
import {shallowEqual} from './utils/collection';
|
import {shallowEqual, shallowEqualArrays} from './utils/collection';
|
||||||
import {Tree, TreeNode} from './utils/tree';
|
import {Tree, TreeNode} from './utils/tree';
|
||||||
|
|
||||||
|
|
||||||
|
@ -188,10 +188,14 @@ function serializeNode(node: TreeNode<ActivatedRouteSnapshot>): string {
|
||||||
* And we detect that by checking if the snapshot field is set.
|
* And we detect that by checking if the snapshot field is set.
|
||||||
*/
|
*/
|
||||||
export function advanceActivatedRoute(route: ActivatedRoute): void {
|
export function advanceActivatedRoute(route: ActivatedRoute): void {
|
||||||
if (route.snapshot && !shallowEqual(route.snapshot.params, route._futureSnapshot.params)) {
|
if (route.snapshot) {
|
||||||
|
if (!shallowEqual(route.snapshot.params, route._futureSnapshot.params)) {
|
||||||
|
(<any>route.params).next(route._futureSnapshot.params);
|
||||||
|
}
|
||||||
|
if (!shallowEqualArrays(route.snapshot.url, route._futureSnapshot.url)) {
|
||||||
|
(<any>route.url).next(route._futureSnapshot.url);
|
||||||
|
}
|
||||||
route.snapshot = route._futureSnapshot;
|
route.snapshot = route._futureSnapshot;
|
||||||
(<any>route.url).next(route.snapshot.url);
|
|
||||||
(<any>route.params).next(route.snapshot.params);
|
|
||||||
} else {
|
} else {
|
||||||
route.snapshot = route._futureSnapshot;
|
route.snapshot = route._futureSnapshot;
|
||||||
}
|
}
|
||||||
|
|
|
@ -6,6 +6,14 @@
|
||||||
* found in the LICENSE file at https://angular.io/license
|
* found in the LICENSE file at https://angular.io/license
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
export function shallowEqualArrays(a:any[], b:any[]):boolean {
|
||||||
|
if (a.length !== b.length) return false;
|
||||||
|
for (let i = 0; i < a.length; ++i) {
|
||||||
|
if (!shallowEqual(a[i], b[i])) return false;
|
||||||
|
}
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
export function shallowEqual(a: {[x: string]: any}, b: {[x: string]: any}): boolean {
|
export function shallowEqual(a: {[x: string]: any}, b: {[x: string]: any}): boolean {
|
||||||
const k1 = Object.keys(a);
|
const k1 = Object.keys(a);
|
||||||
const k2 = Object.keys(b);
|
const k2 = Object.keys(b);
|
||||||
|
|
|
@ -133,17 +133,21 @@ describe('Integration', () => {
|
||||||
const fixture = tcb.createFakeAsync(RootCmp);
|
const fixture = tcb.createFakeAsync(RootCmp);
|
||||||
advance(fixture);
|
advance(fixture);
|
||||||
|
|
||||||
router.resetConfig([{path: '**', component: SimpleCmp}]);
|
router.resetConfig([{path: '**', component: CollectParamsCmp}]);
|
||||||
|
|
||||||
router.navigateByUrl('/one/two');
|
router.navigateByUrl('/one/two');
|
||||||
advance(fixture);
|
advance(fixture);
|
||||||
|
const cmp = fixture.debugElement.children[1].componentInstance;
|
||||||
expect(location.path()).toEqual('/one/two');
|
expect(location.path()).toEqual('/one/two');
|
||||||
expect(fixture.debugElement.nativeElement).toHaveText('simple');
|
expect(fixture.debugElement.nativeElement).toHaveText('collect-params');
|
||||||
|
|
||||||
|
expect(cmp.recordedUrls()).toEqual(['one/two']);
|
||||||
|
|
||||||
router.navigateByUrl('/three/four');
|
router.navigateByUrl('/three/four');
|
||||||
advance(fixture);
|
advance(fixture);
|
||||||
expect(location.path()).toEqual('/three/four');
|
expect(location.path()).toEqual('/three/four');
|
||||||
expect(fixture.debugElement.nativeElement).toHaveText('simple');
|
expect(fixture.debugElement.nativeElement).toHaveText('collect-params');
|
||||||
|
expect(cmp.recordedUrls()).toEqual(['one/two', 'three/four']);
|
||||||
})));
|
})));
|
||||||
|
|
||||||
it('should support secondary routes',
|
it('should support secondary routes',
|
||||||
|
@ -1025,6 +1029,21 @@ class LinkWithQueryParamsAndFragment {
|
||||||
class SimpleCmp {
|
class SimpleCmp {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@Component({selector: 'collect-params-cmp', template: `collect-params`, directives: ROUTER_DIRECTIVES})
|
||||||
|
class CollectParamsCmp {
|
||||||
|
private params: any = [];
|
||||||
|
private urls: any = [];
|
||||||
|
|
||||||
|
constructor(a: ActivatedRoute) {
|
||||||
|
a.params.forEach(p => this.params.push(p));
|
||||||
|
a.url.forEach(u => this.urls.push(u));
|
||||||
|
}
|
||||||
|
|
||||||
|
recordedUrls(): string[] {
|
||||||
|
return this.urls.map(a => a.map(p => p.path).join('/'));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@Component({selector: 'blank-cmp', template: ``, directives: ROUTER_DIRECTIVES})
|
@Component({selector: 'blank-cmp', template: ``, directives: ROUTER_DIRECTIVES})
|
||||||
class BlankCmp {
|
class BlankCmp {
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue