docs(core): make naming concrete

I think people new to promises, angular etc will find this example easier to understand with concrete identifiers from a simple use-case. The existing naming could be confused with promise/angular functionality (`promise` in the template, `resolved` etc).

Also I made `resolve` private, as then it's clear what we're exposing for the template.
This commit is contained in:
Tim Ruffles 2015-11-19 15:17:35 -08:00 committed by Jeremy Elbourn
parent b9b14dc731
commit bdfed9d850
1 changed files with 11 additions and 10 deletions

View File

@ -5,28 +5,29 @@ import {bootstrap} from 'angular2/bootstrap';
@Component({
selector: 'async-example',
template: `<div>
<p>Wait for it... {{promise | async}}</p>
<button (click)="clicked()">{{resolved ? 'Reset' : 'Resolve'}}</button>
<p>Wait for it... {{ greeting | async }}</p>
<button (click)="clicked()">{{ arrived ? 'Reset' : 'Resolve' }}</button>
</div>`
})
export class AsyncPipeExample {
resolved: boolean = false;
promise: Promise<string> = null;
resolve: Function = null;
greeting: Promise<string> = null;
arrived: boolean = false;
private resolve: Function = null;
constructor() { this.reset(); }
reset() {
this.resolved = false;
this.promise = new Promise<string>((resolve, reject) => { this.resolve = resolve; });
this.arrived = false;
this.greeting = new Promise<string>((resolve, reject) => { this.resolve = resolve; });
}
clicked() {
if (this.resolved) {
if (this.arrived) {
this.reset();
} else {
this.resolve("resolved!");
this.resolved = true;
this.resolve("hi there!");
this.arrived = true;
}
}
}