docs(pipes): move pipe examples to the common folder
This commit is contained in:
parent
5fad37df69
commit
caa1cd2470
|
@ -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);
|
|
||||||
}
|
|
|
@ -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>
|
|
|
@ -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>
|
|
|
@ -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>
|
|
|
@ -1,24 +0,0 @@
|
||||||
<!doctype html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<title>LowercasePipe & 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>
|
|
|
@ -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>
|
|
|
@ -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>
|
|
Loading…
Reference in New Issue