如何在使用Angular 2和TypeScript的承诺中设置变量

Question

Im如何在使用TypeScript的Angular 2中使用承诺有点困惑。例如，我创建了一个获取一些JSON的服务，我想将结果设置为一个数组。

因此，例如在角1，我将做到以下几点：

workService.getAllWork().then(function(result){ 
    vm.projects = result.projects; 
}); 

在角2，我有以下服务：

import {Injectable} from '@angular/core'; 
import {Http, Response} from '@angular/http'; 
import {Observable} from 'rxjs/Observable'; 

@Injectable() 
export class WorkService { 
constructor(private _http: Http) { } 
    getAllProjects() { 
    return this._http.get('/fixture/work.json') 
     .map((response: Response) => response.json().projects) 
     .do(projects => console.log('projects: ', projects)) 
     .toPromise() 
     .catch(this.handleError); 
    } 

    private handleError(error: Response) { 
    console.error(error); 
    return Observable.throw(error.json().error || 'Server error'); 
    } 
} 

在我组分I有：

import {Component} from '@angular/core'; 
import {HTTP_PROVIDERS} from '@angular/http'; 
import {Showcase} from '../showcase/showcase.component'; 
import {WorkService} from '../services/work.service'; 

@Component({ 
    selector: 'App', 
    template: require('./landing.html'), 
    directives: [Showcase], 
    providers: [HTTP_PROVIDERS, WorkService] 
}) 

export class Landing { 
    public projects: Array<any>; 

    constructor(private _workService: WorkService) {} 

    ngOnInit() { 
    // How would I set the projects array to the WorkService results 
    } 
} 

任何帮助将不胜感激。

Answer 1

对于Promise，您使用.then(...)来链接呼叫。

ngOnInit() { 
    this.workService.getAllProjects().then(value => this.projects = value); 
    } 

你应该知道，

ngOnInit() { 
    this.workService.getAllProjects().then(value => this.workService = value); 
    // <=== code here is executed before `this.workService.value` is executed 
    } 

如果你想解决的承诺后执行代码，使用

ngOnInit() { 
    this.workService.getAllProjects().then(value => { 
     this.workService = value; 
     // more code here 
    }); 
    }