返回数据以订阅角度的可观察对象

Question

我正在尝试将数据返回到我的组件，然后使用来自服务的数据作为参数来触发路由。我认为我错误地使用了 observables，如果数据可以返回给订阅，或者我是否应该触发服务提供商的路由，我会感到困惑。从服务提供商触发路由的问题在于 extractData 内部的范围发生了变化。我可以从 extractData() 中访问 this.router 吗？组件在提交表单时设置如下：

更新：

组件：

private dataFromServer: ShortFormModel;
onSubmit(shortForm: any) {
    if (!shortForm) { return; }
    const formModel = this.shortForm.value;
    this.shortFormService.create(formModel)
    .subscribe(body => { this.dataFromServer = body; console.log(body) })
  }) 
 }

服务提供商：

create(shortForm: any): Observable<ShortFormModel> {
 let headers = new Headers({'Content-Type': 'application/json'});
 let options = new RequestOptions({headers: headers});

 return this.http.post(this.preCheckUrl, shortForm, options)
  .map((res) => this.extractData(res))
  .catch(
  (error: any): Promise<any>=> {
    this.router.navigate(['/error', error]);
    return Promise.reject(error.message || error);
  }
 )
}

private extractData(res: Response) {
  let body = res.json();
  this.router.navigate(['/apply', body.appId])
  return body|| { };
}

响应负载：

{  
  "offer":{  
   "id":null,
   "amount":null,
},
"dupes":true,
"appId":53
}

Answer 1

你确实是对的，当使用时

.map(this.extractData)

范围在extractData 内部发生变化。您必须将对 this.extractData 的调用包装在 lambda/fat-arrow 函数中以保留作用域，如下所示：

.map((res) => this.extractData(res))