chore: router move-only
This commit is contained in:
@ -0,0 +1,24 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Routing Reuse Lifecycle Example</title>
|
||||
<base href="/">
|
||||
|
||||
<script src="http://cdn.rawgit.com/google/traceur-compiler/90da568c7aa8e53ea362db1fc211fbb4f65b5e94/bin/traceur-runtime.js"></script>
|
||||
<script src="http://cdnjs.cloudflare.com/ajax/libs/systemjs/0.18.4/system.js"></script>
|
||||
<script>System.config({ baseURL: '/', defaultJSExtensions: true});</script>
|
||||
<script src="/bundle/angular2.dev.js"></script>
|
||||
<script src="/bundle/router.dev.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<example-app>
|
||||
Loading...
|
||||
</example-app>
|
||||
<script>
|
||||
var filename = '@angular/examples/router/ts/on_deactivate/on_deactivate_example';
|
||||
System.import(filename).then(function(m) {
|
||||
m.main();
|
||||
}, console.error.bind(console));
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,58 @@
|
||||
import {Component, Injectable, provide, ComponentRef} from '@angular/core';
|
||||
import {bootstrap} from '@angular/platform-browser-dynamic';
|
||||
import {OnDeactivate, ComponentInstruction, RouteConfig, ROUTER_DIRECTIVES} from '@angular/router';
|
||||
import {APP_BASE_HREF} from '@angular/common';
|
||||
|
||||
|
||||
@Injectable()
|
||||
export class LogService {
|
||||
logs: string[] = [];
|
||||
|
||||
addLog(message: string): void { this.logs.push(message); }
|
||||
}
|
||||
|
||||
|
||||
// #docregion routerOnDeactivate
|
||||
@Component({selector: 'my-cmp', template: `<div>hello</div>`})
|
||||
class MyCmp implements OnDeactivate {
|
||||
constructor(private logService: LogService) {}
|
||||
|
||||
routerOnDeactivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
this.logService.addLog(
|
||||
`Navigating from "${prev ? prev.urlPath : 'null'}" to "${next.urlPath}"`);
|
||||
}
|
||||
}
|
||||
// #enddocregion
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'example-app',
|
||||
template: `
|
||||
<h1>My App</h1>
|
||||
<nav>
|
||||
<a [routerLink]="['/HomeCmp']" id="home-link">Navigate Home</a> |
|
||||
<a [routerLink]="['/ParamCmp', {param: 1}]" id="param-link">Navigate with a Param</a>
|
||||
</nav>
|
||||
<router-outlet></router-outlet>
|
||||
<div id="log">
|
||||
<h2>Log:</h2>
|
||||
<p *ngFor="let logItem of logService.logs">{{ logItem }}</p>
|
||||
</div>
|
||||
`,
|
||||
directives: [ROUTER_DIRECTIVES]
|
||||
})
|
||||
@RouteConfig([
|
||||
{path: '/', component: MyCmp, name: 'HomeCmp'},
|
||||
{path: '/:param', component: MyCmp, name: 'ParamCmp'}
|
||||
])
|
||||
export class AppCmp {
|
||||
constructor(public logService: LogService) {}
|
||||
}
|
||||
|
||||
|
||||
export function main(): Promise<ComponentRef<AppCmp>> {
|
||||
return bootstrap(AppCmp, [
|
||||
provide(APP_BASE_HREF, {useValue: '/@angular/examples/router/ts/on_deactivate'}),
|
||||
LogService
|
||||
]);
|
||||
}
|
@ -0,0 +1,32 @@
|
||||
import {verifyNoBrowserErrors, browser} from '@angular/platform-browser/testing_e2e';
|
||||
import {expect} from '@angular/core/testing';
|
||||
|
||||
function waitForElement(selector: string) {
|
||||
var EC = (<any>protractor).ExpectedConditions;
|
||||
// Waits for the element with id 'abc' to be present on the dom.
|
||||
browser.wait(EC.presenceOf($(selector)), 20000);
|
||||
}
|
||||
|
||||
describe('on activate example app', function() {
|
||||
afterEach(verifyNoBrowserErrors);
|
||||
|
||||
var URL = '@angular/examples/router/ts/on_deactivate/';
|
||||
|
||||
it('should update the text when navigating between routes', function() {
|
||||
browser.get(URL);
|
||||
waitForElement('my-cmp');
|
||||
|
||||
expect(element(by.css('#log')).getText()).toEqual('Log:');
|
||||
|
||||
element(by.css('#param-link')).click();
|
||||
waitForElement('my-cmp');
|
||||
|
||||
expect(element(by.css('#log')).getText()).toEqual('Log:\nNavigating from "" to "1"');
|
||||
|
||||
browser.navigate().back();
|
||||
waitForElement('my-cmp');
|
||||
|
||||
expect(element(by.css('#log')).getText())
|
||||
.toEqual('Log:\nNavigating from "" to "1"\nNavigating from "./1" to ""');
|
||||
});
|
||||
});
|
Reference in New Issue
Block a user