angularjs - Angular2 RxJS 从 map 函数调用类函数

标签 angularjs angular rxjs angular2-services

我是 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 函数中引用了 thisthis 没有引用 PersonsService 类,但它引用了一个 MapSubscriber 对象。

我不知道是否可以调用“外部”函数。这可能是一件愚蠢的事情,但我找不到任何相关信息。

最佳答案

而不是仅仅传递函数引用使用arrow保留this

的函数
.map((res) => this.extractData(res))

关于angularjs - Angular2 RxJS 从 map 函数调用类函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37216807/

相关文章:

angularjs - Uncaught Error : [$injector:modulerr] http://errors. angularjs.org/1.2.14/$injector/modulerr

javascript - 访问 Controller 中 html 元素中的 ng-if 属性的值

node.js - Socket.io 在部署后无法工作 - 抛出错误 - 405(不允许)

javascript - Angular2 中的跨域验证

javascript - 如何判断我是否在使用 Ionic2 的移动平台上?

typescript - RxDB RxCollectionCreator typescript 错误

javascript - 使用 webpack 将 font-awesome 添加到项目中

javascript - Google map - 拖放标记并绘制路线

angular - 为什么 rxjs 没有将我的 Observable.throw 传递给订阅者?

javascript - 如果在 rxjs 中没有按顺序重复 3 次,如何跳过 0 值