具有Angular 2 / Typescript中的Observable的多步函数

I am trying to follow a simple pattern in the Angular 2 docs, but am having difficulty executing a function.

我试图在Angular 2文档中遵循一个简单的模式,但是执行函数时遇到了困难。

The example I am working from is here (app/toh/hero.service.ts (observable-based) file):

我正在使用的示例是(app / toh / hero.service.ts(基于observable)文件):

  getHeroes (): Observable<Hero[]> {
    return this.http.get(this.heroesUrl)
                    .map(this.extractData)
                    .catch(this.handleError);
  }
  addHero (name: string): Observable<Hero> {
    let body = JSON.stringify({ name });
    let headers = new Headers({ 'Content-Type': 'application/json' });
    let options = new RequestOptions({ headers: headers });
    return this.http.post(this.heroesUrl, body, options)
                    .map(this.extractData)
                    .catch(this.handleError);
  }
  private extractData(res: Response) {
    let body = res.json();
    return body.data || { };
  }
  private handleError (error: any) {
    // In a real world app, we might use a remote logging infrastructure
    // We'd also dig deeper into the error to get a better message
    let errMsg = (error.message) ? error.message :
      error.status ? `${error.status} - ${error.statusText}` : 'Server error';
    console.error(errMsg); // log to console instead
    return Observable.throw(errMsg);
  }

I need to store a token after the extractData function, but do not think I'm calling it in right. I get it to work when I put it in the extraData function, but I would like it to work on it's own:

我需要在extractData函数之后存储一个令牌,但不要以为我正在调用它。当我把它放在extraData函数中时,我得到它的工作,但我希望它可以自己工作:

 private extractData(res: Response) {
    let body = res.json();
    if (body.response.user) {
      return this.storeToken;
    }
  }
  // want to call this function, but i'm doing something wrong
  private storeToken(res: Response ) {
    let resp = res;
    console.log("resp", resp);
    this.userId = resp.user.id;
    this.token = resp.user.authentication_token;
    localStorage.setItem('userId', this.userId);
    localStorage.setItem('token', this.token);
    return Rx.Observable.of('token', 'userId');
  }
  private handleError (error: any) {
    // In a real world app, we might use a remote logging infrastructure
    // We'd also dig deeper into the error to get a better message
    let errMsg = (error.message) ? error.message :
      error.status ? `${error.status} - ${error.statusText}` : 'Server error';
    console.error(errMsg); // log to console instead
    return Rx.Observable.throw(errMsg);
  }

I am not sure if any data is being passed into the return this.storeToken function, and I am not sure how to call it in the storeToken operator (res: Response).

我不确定是否有任何数据传递给返回this.storeToken函数,我不知道如何在storeToken运算符中调用它(res:Response)。

I feel this is extremely basic, but I have been hung up on it so any help is greatly appreciated! Thank you!

我觉得这是非常基本的,但我已经挂了它,所以任何帮助都非常感谢!谢谢!

Edit: This function works, but I would like to separate in two:

编辑:这个功能有效,但我想分成两个:

private extractData(res: Response) {
    let body = res.json();
    if (body.response.user) {
      this.userId = body.response.user.id;
      this.token = body.response.user.authentication_token;
      console.log("id:", this.userId);
      console.log("token:", this.token);
      localStorage.setItem('userId', this.userId);
      localStorage.setItem('token', this.token);
      return Rx.Observable.of('token', 'userId');
    }
  }

Edit 2: Reading up on subscriptions and observables.

编辑2:阅读订阅和观察。

1 个解决方案

#1

It seems like you need to be returning the invocation of the .extractData method rather than its signature?

看来你需要返回.extractData方法的调用而不是它的签名?

Instead of

private extractData(res: Response) {
    let body = res.json();
    if (body.response.user) {
      return this.storeToken;
    }
  }

Try this

private extractData(res: Response) {
    let body = res.json();
    if (body.response.user) {
      return this.storeToken(res);
    }
  }

#1