docs(pipes): move pipe examples to the common folder

This commit is contained in:
Misko Hevery 2016-09-08 13:31:41 -07:00 committed by Igor Minar
parent 5fad37df69
commit caa1cd2470
12 changed files with 4 additions and 167 deletions

View File

@ -14,13 +14,13 @@ import {Subscriber} from 'rxjs/Subscriber';
// #docregion AsyncPipePromise // #docregion AsyncPipePromise
@Component({ @Component({
selector: 'async-example', selector: 'async-promise',
template: `<div> template: `<div>
<p>Wait for it... {{ greeting | async }}</p> <p>Wait for it... {{ greeting | async }}</p>
<button (click)="clicked()">{{ arrived ? 'Reset' : 'Resolve' }}</button> <button (click)="clicked()">{{ arrived ? 'Reset' : 'Resolve' }}</button>
</div>` </div>`
}) })
export class AsyncPipeExample { export class AsyncPromiseComponent {
greeting: Promise<string> = null; greeting: Promise<string> = null;
arrived: boolean = false; arrived: boolean = false;
@ -45,29 +45,10 @@ export class AsyncPipeExample {
// #enddocregion // #enddocregion
// #docregion AsyncPipeObservable // #docregion AsyncPipeObservable
@Component({selector: 'task-cmp', template: 'Time: {{ time | async }}'}) @Component({selector: 'async-observable', template: '<div>Time: {{ time | async }}</div>'})
class Task { export class AsyncObservableComponent {
time = new Observable<number>((observer: Subscriber<number>) => { time = new Observable<number>((observer: Subscriber<number>) => {
setInterval(() => observer.next(new Date().getTime()), 500); setInterval(() => observer.next(new Date().getTime()), 500);
}); });
} }
// #enddocregion // #enddocregion
@Component({
selector: 'example-app',
template: `
<h1>AsyncPipe Example</h1>
<async-example></async-example>
`
})
export class AppCmp {
}
@NgModule(
{declarations: [AsyncPipeExample, AppCmp, Task], imports: [BrowserModule], bootstrap: [AppCmp]})
class AppModule {
}
export function main() {
platformBrowserDynamic().bootstrapModule(AppModule);
}

View File

@ -1,24 +0,0 @@
<!doctype html>
<html>
<head>
<title>AsyncPipe 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/core/pipes/ts/async_pipe/async_pipe_example';
System.import(filename).then(function(m) {
m.main();
}, console.error.bind(console));
</script>
</body>
</html>

View File

@ -1,24 +0,0 @@
<!doctype html>
<html>
<head>
<title>DatePipe 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/core/pipes/ts/date_pipe/date_pipe_example';
System.import(filename).then(function(m) {
m.main();
}, console.error.bind(console));
</script>
</body>
</html>

View File

@ -1,24 +0,0 @@
<!doctype html>
<html>
<head>
<title>JsonPipe 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/core/pipes/ts/json_pipe/json_pipe_example';
System.import(filename).then(function(m) {
m.main();
}, console.error.bind(console));
</script>
</body>
</html>

View File

@ -1,24 +0,0 @@
<!doctype html>
<html>
<head>
<title>LowercasePipe &amp; UppercasePipe 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/core/pipes/ts/lowerupper_pipe/lowerupper_pipe_example';
System.import(filename).then(function(m) {
m.main();
}, console.error.bind(console));
</script>
</body>
</html>

View File

@ -1,24 +0,0 @@
<!doctype html>
<html>
<head>
<title>Numeric Pipe Examples</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/core/pipes/ts/number_pipe/number_pipe_example';
System.import(filename).then(function(m) {
m.main();
}, console.error.bind(console));
</script>
</body>
</html>

View File

@ -1,24 +0,0 @@
<!doctype html>
<html>
<head>
<title>SlicePipe 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/core/pipes/ts/slice_pipe/slice_pipe_example';
System.import(filename).then(function(m) {
m.main();
}, console.error.bind(console));
</script>
</body>
</html>