Angular 2 承诺问题

Question

我开始学习 Angular 2，但我在使用 Promise.then 到 return 我的服务对象时遇到问题。我目前只使用固定数组 (COACHES) 来伪造数据库调用。我服务中的功能如下

getCoach(id: number) {
    return Promise.resolve(COACHES).then(
        coaches => coaches.filter(coach => coach.id == id)[0]
    );
}

然后我在 ngOnInit 挂钩中的 coach_detail.component.ts 中使用它来使用路由参数获取我想要的教练对象：

export class CoachDetailComponent implements OnInit {

    coach: Coach;

    constructor(
        private _coachService: CoachService,
        private _routeParams: RouteParams) {}

    ngOnInit() {
        let id = +this._routeParams.get('id');
        this._coachService.getCoach(id).then(coach => this.coach = coach);
        console.log(this.coach);
    }
}

我可以在我的控制台中看到 promise returning 回到我的组件但是 console.log(this.coach) returning 作为 undefined

非常感谢任何帮助，因为我在不同的组件中使用类似的逻辑来 return 整个教练列表，这很好用！

Answer 1

你的 console.log() 在执行承诺链之前被调用。

ngOnInit() {
    let id = +this._routeParams.get('id');
    this._coachService.getCoach(id).then(coach => { 
      this.coach = coach 
      console.log(this.coach); // not undefined
    });
    console.log(this.coach); // undefined
}

Angular 2 承诺问题

Angular 2 Promise issue

typescript

es6-promise

angular