Angular2 RxJS从地图函数调用类函数 [英] Angular2 RxJS calling class function from map function

问题描述

我是Angular 2和Observables的新手，所以对我的问题微不足道，我表示歉意.无论如何，我正在尝试使用RxJS测试Angular 2 HTTP客户端.尽管它可以正常工作，但我需要为当前正在使用的服务添加更多逻辑.基本上，我想拥有一个映射功能，将我从连接的Web服务接收到的对象转换为Angular中的模型对象.

这是有效的代码:

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

import { Person } from '../models/person';

@Injectable()
export class PersonsService {

    constructor(private http: Http) { }

    private personsUrl = 'http://localhost/api/persons';

    getPersons(): Observable<Person[]> {
        return this.http.get(this.personsUrl)
            .map(this.extractData)
            .catch(this.handleError);
    }

    private extractData(res: Response) {
        if(res.status < 200 || res.status >= 300) {
            throw new Error('Bad response status ' + res.status);
        }

        let body = res.json();
        return body.data || {};
    }

    private handleError(error: any) {
        let errMsg = error.message;
        return Observable.throw(errMsg);
    }
}

使用上面的代码，我没有任何问题.我遇到的问题是我想将从服务中获取的对象映射到Angular中的对象，即Person.我试过的是从.map函数正在使用的extractData函数中调用另一个函数.

private extractData(res: Response) {
    if(res.status < 200 || res.status >= 300) {
        throw new Error('Bad response status ' + res.status);
    }

    let body = res.json();
    // map data function
    var data = this.mapData(body.data);

    return data || {};
}

private mapData(data: any) {
    // code to map data
}

显然，上面的代码不起作用，因为在extractData函数中引用了this时，this并不引用PersonsService类，但是它引用了MapSubscriber对象.

我不知道是否可以调用外部"函数.这可能是愚蠢的事情，但我找不到有关此的任何信息.

解决方案

使用

解决方案

Instead of just passing the function reference use arrow functions to retain this

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

这篇关于Angular2 RxJS从地图函数调用类函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！