diff --git a/modules/angular2/src/alt_router/router.ts b/modules/angular2/src/alt_router/router.ts index 862364b60b..b5630beac0 100644 --- a/modules/angular2/src/alt_router/router.ts +++ b/modules/angular2/src/alt_router/router.ts @@ -2,7 +2,12 @@ import {OnInit, provide, ReflectiveInjector, ComponentResolver} from 'angular2/c import {RouterOutlet} from './directives/router_outlet'; import {Type, isBlank, isPresent} from 'angular2/src/facade/lang'; import {ListWrapper} from 'angular2/src/facade/collection'; -import {EventEmitter, Observable, PromiseWrapper} from 'angular2/src/facade/async'; +import { + EventEmitter, + Observable, + PromiseWrapper, + ObservableWrapper +} from 'angular2/src/facade/async'; import {StringMapWrapper} from 'angular2/src/facade/collection'; import {BaseException} from 'angular2/src/facade/exceptions'; import {RouterUrlSerializer} from './router_url_serializer'; @@ -33,13 +38,14 @@ export class RouterOutletMap { export class Router { private _prevTree: Tree; private _urlTree: Tree; - + private _locationSubscription: any; private _changes: EventEmitter = new EventEmitter(); constructor(private _rootComponent: Object, private _rootComponentType: Type, private _componentResolver: ComponentResolver, private _urlSerializer: RouterUrlSerializer, private _routerOutletMap: RouterOutletMap, private _location: Location) { + this._setUpLocationChangeListener(); this.navigateByUrl(this._location.path()); } @@ -53,6 +59,13 @@ export class Router { return this._navigate(this.createUrlTree(changes, segment)); } + dispose(): void { ObservableWrapper.dispose(this._locationSubscription); } + + private _setUpLocationChangeListener(): void { + this._locationSubscription = this._location.subscribe( + (change) => { this._navigate(this._urlSerializer.parse(change['url'])); }); + } + private _navigate(url: Tree): Promise { this._urlTree = url; return recognize(this._componentResolver, this._rootComponentType, url) diff --git a/modules/angular2/src/alt_router/router_providers_common.ts b/modules/angular2/src/alt_router/router_providers_common.ts index c5c3153d8a..e80e602d94 100644 --- a/modules/angular2/src/alt_router/router_providers_common.ts +++ b/modules/angular2/src/alt_router/router_providers_common.ts @@ -24,6 +24,8 @@ function routerFactory(app: ApplicationRef, componentResolver: ComponentResolver throw new BaseException("Bootstrap at least one component before injecting Router."); } // TODO: vsavkin this should not be null - return new Router(null, app.componentTypes[0], componentResolver, urlSerializer, routerOutletMap, - location); + let router = new Router(null, app.componentTypes[0], componentResolver, urlSerializer, + routerOutletMap, location); + app.registerDisposeListener(() => router.dispose()); + return router; } \ No newline at end of file diff --git a/modules/angular2/test/alt_router/integration_spec.ts b/modules/angular2/test/alt_router/integration_spec.ts index 854768f63f..7e90d73986 100644 --- a/modules/angular2/test/alt_router/integration_spec.ts +++ b/modules/angular2/test/alt_router/integration_spec.ts @@ -64,6 +64,19 @@ export function main() { expect(location.path()).toEqual('/team/33/simple'); }))); + it('should navigate when locations changes', + fakeAsync(inject([Router, TestComponentBuilder, Location], (router, tcb, location) => { + let fixture = tcb.createFakeAsync(RootCmp); + + router.navigateByUrl('/team/22/user/victor'); + advance(fixture); + + location.simulateHashChange("/team/22/user/fedor"); + advance(fixture); + + expect(fixture.debugElement.nativeElement).toHaveText('team 22 { hello fedor, aux: }'); + }))); + it('should support nested routes', fakeAsync(inject([Router, TestComponentBuilder], (router, tcb) => { let fixture = tcb.createFakeAsync(RootCmp); diff --git a/modules/playground/src/alt_routing/inbox-app.ts b/modules/playground/src/alt_routing/inbox-app.ts index 5a489c528c..179468ed86 100644 --- a/modules/playground/src/alt_routing/inbox-app.ts +++ b/modules/playground/src/alt_routing/inbox-app.ts @@ -7,7 +7,7 @@ import { ROUTER_PROVIDERS, OnActivate, RouteSegment, - Tree + Tree, } from 'angular2/alt_router'; import * as db from './data'; import {Location} from 'angular2/platform/common';