Angular Resolver调用报错：Property 'then' is missing 求助

咱们先把问题拆明白：你写的Observable.fromPromise()方法要求传入一个Promise类型的值，但你的getUserDetailsByToken()服务方法返回的是一个Observable，不是Promise，这就直接触发了类型不匹配的错误。

最简洁的修复方案（推荐） #

Resolver本身就支持直接返回Observable类型，完全没必要多一步把Observable转成Promise再转回Observable。直接修改你的Resolver代码：

resolve(route: ActivatedRouteSnapshot): Observable<any> {
  let JsonVal = JSON.parse(localStorage.getItem('RegistrationSteps'));
  let postData = { 'token': JsonVal.auth_token }
  let url = 'getUserDetails';
  
  // 直接返回服务的Observable，加上take(1)确保流完成
  return this.apiservices.getUserDetailsByToken(postData, url)
    .take(1);
}

这里加take(1)的原因是：Resolver要求返回的Observable必须完成（也就是流要结束），否则路由会一直卡在加载状态。take(1)会获取Observable的第一个值后立即结束流，正好符合Resolver的要求。

另一种方案（如果一定要用Promise的话） #

如果你坚持要通过Promise来处理，那需要先把服务返回的Observable转成Promise，用toPromise()方法：

resolve(route: ActivatedRouteSnapshot): Observable<any> {
  let JsonVal = JSON.parse(localStorage.getItem('RegistrationSteps'));
  let postData = { 'token': JsonVal.auth_token }
  let url = 'getUserDetails';
  
  // 先把Observable转为Promise，再用fromPromise包装
  return Observable.fromPromise(
    this.apiservices.getUserDetailsByToken(postData, url).toPromise()
  );
}

额外小检查 #

别忘了在你的服务里导入Headers，不然new Headers()会报错：

import { Headers, Http } from '@angular/http';

这样修改后，你的Resolver就能正常工作，组件里通过this.route.snapshot.data['userdata']也能正确获取到数据了。

内容的提问来源于stack exchange，提问作者Rahul