角2的HTTP服务无法揭图（）等函数RxJS [英] Angular 2's Http service not exposing map() and other RxJS functions

问题描述

是否有人知道，如果有一直阿尔法45和α48之间的任何HTTP重大更改？我一直在寻找周围，我没有发现任何东西。我的问题是低于code的Alpha上45完美工作，但现在我已经升级到阿尔法48我得到一个 _this.http.post（...）。地图不是一个函数当我尝试运行应用程序的错误消息。奇怪的是，智能感知显示http.post是返回一个可观察的。这意味着，在地图上的功能应该是可用的。任何帮助将是AP preciated。谢谢！

 公开进行身份验证（用户名：字符串，密码：字符串）：可观察＆LT;布尔＆GT; {    this.ResetAuthenticationValues​​（）;    返回Observable.create（（用户：EventEmitter＆LT;串GT）=＆GT; {        让身体：字符串='grant_type =密码＆放大器;用户名='+用户名+'和;密码='+密码;
        让标题=新的报头（）;
        headers.append（Content-Type的'，'应用程序/ x-WWW的形式urlen codeD'）;        this.http.post（'http://example.com'，身体，{标题：标题}）
            .MAP（RES =＆GT; res.json（））
            。订阅（
                （数据：DataResponse）= GT; {
                    如果（！data.error）{
                        this.accessToken = {的access_token：data.access_token，token_type：data.token_type};
                        subscriber.next（this.isAuthenticated = TRUE）;
                    }
                    其他
                        subscriber.error（this.isAuthenticated = FALSE）;
                }，
                （ERR）=＆GT; subscriber.error（ERR）
                （）=＆GT; subscriber.complete（）
            ）;        回报（）= GT; {};
    }）;
}
 

解决方案

另一个更新 （咳嗽，我们对此深感抱歉，忘了此选项）的

如果你想避免做单独加入运营商可以导入完整的接收

从'rxjs /接收进口{观测，主题，ReplaySubject等..};


您将有所有操作员：）

更新阿尔法50 （2015年8月12日）

49字母被释放后不久，他们发布阿尔法50.此版本升级rxjs阿尔法14，所以你会好做去

NPM安装angular2 @最新
NPM安装rxjs@5.0.0-alpha.14


更新阿尔法49 （2015年8月12日）

如现在阿尔法49 的被释放，这并没有改变，这意味着这将保持时间。原始答案仍然有一些变化有效，路径改变rjxs，所以应该如下：

System.config（{
    路径：{
        rxjs /添加/可观测/ *：node_modules / rxjs /添加/可观测/ * JS。，
        rxjs /添加/运营/ *'：'node_modules / rxjs /添加/运营/ * JS'，
        rxjs / *'：'node_modules / rxjs / * JS
    }
}）;进口'rxjs /添加/运营/图;


注意

这个版本需要完全阿尔法13 的版本，所以如果你的的package.json 您已经另一个版本，你必须将其删除，安装angular2，然后再安装rjxs。

更新

的<一个href=\"https://github.com/angular/angular/blob/master/CHANGELOG.md#200-alpha48-2015-12-05\">CHANGELOG已更新，以显示这个重大更改。有来自@jeffbcross 中的评论=htt​​ps://github.com/角/角/问题/ 5642>问题＃5642 ，在这个问题澄清了许多。

该意见的部分引用

  

模块化从一开始就新RxJS项目的目标，而且直到最近，我们才开始真正得到认真撰写运营商，而不是依赖于接收的分层分布。

原来的答复

有实际上关于RxJS和Angular2重大更改。所以现在使用像地图运营商你必须单独导入。你可以看到在这个拉申请的变化。还有的已经是一个问题你的问题。

我建议你坚持阿尔法47.但是大家谁需要，想知道解决的办法是什么，就像在拉请求中指定，单独添加操作。

您必须有这样的事情

进口{HTTP，...} ...;// 零件
构造函数（HTTP：HTTP）{
    http.get（...）。图（）//地图不存在！哎哟!
}


要修复它，加上运营商（抱歉重复很多次），并配置路径rxjs

注意

这必须RxJS阿尔法11，或α12（的不 @ reactivex / rxjs 混淆完成，现在它只是 rxjs 的）。因此，与安装

NPM安装rxjs@5.0.0-alpha.11


或只是 NPM安装rxjs 如果你想要最新的，虽然他们的锁定的是阿尔法11。

配置在System.config路径（注意，这是我的配置，不一定是最好的，我假设你安装了阿尔法11）

System.config（{
    路径：{
        rxjs /可观测/ *：node_modules / rxjs /可观测/ * JS。，
        rxjs /运营/ *'：'node_modules / rxjs /运营/ * JS'，
        rxjs / *'：'node_modules / rxjs / * JS
    }
}）;


您与配置完成后，你可以导入操作如下：

进口'rxjs /运营/图;


而这一切。你必须做，与各运营商。所以，我再说一遍，我建议你坚持阿尔法47，就像我告诉你的评论。我会尽量用plnkr以后更新了答案。

Does anybody know if there's been any breaking changes to the http between alpha 45 and alpha 48? I've been searching around and I didn't find anything. My problem is that the code below was working perfectly on Alpha 45. But now that I've upgraded to Alpha 48 I am getting a _this.http.post(...).map is not a function error message when I try to run the application. The strange thing is that IntelliSense shows that http.post is returning an observable. Which means that the map function should be available. Any help would be appreciated. Thanks!

public Authenticate(username: string, password: string): Observable<boolean> {

    this.ResetAuthenticationValues();

    return Observable.create((subscriber: EventEmitter<string>) => { 

        let body: string = 'grant_type=password&username=' + username + '&password=' + password;
        let headers = new Headers();
        headers.append('Content-Type', 'application/x-www-form-urlencoded');

        this.http.post('http://example.com', body, {headers: headers})
            .map(res => res.json())
            .subscribe(
                (data: DataResponse) => {
                    if (!data.error) {
                        this.accessToken = {access_token: data.access_token, token_type: data.token_type};
                        subscriber.next(this.isAuthenticated = true);                       
                    }
                    else
                        subscriber.error(this.isAuthenticated = false);
                },
                (err) => subscriber.error(err),
                () => subscriber.complete()
            );

        return () => { };
    });
} 

解决方案

Another update (cough, sorry about that, forgot this option)

If you want to avoid adding individually the operators you can import the full Rx by doing

import {Observable, Subject, ReplaySubject, etc...} from 'rxjs/Rx';

You'll have all the operators :)

Update alpha 50 (08/12/2015)

Shortly after alpha 49 was released, they released alpha 50. This version upgraded rxjs to alpha 14. So you'll good to go by doing

npm install angular2@latest
npm install rxjs@5.0.0-alpha.14

Update alpha 49 (08/12/2015)

As of now alpha 49 was released and this didn't change, which means this will remain in time. The original answer is still valid with a few changes, paths changed for rjxs, so it should be as follows :

System.config({
    paths: {
        'rxjs/add/observable/*' : 'node_modules/rxjs/add/observable/*.js',
        'rxjs/add/operator/*' : 'node_modules/rxjs/add/operator/*.js',
        'rxjs/*' : 'node_modules/rxjs/*.js'
    }
});

import 'rxjs/add/operator/map';

Note

This version requires exactly the alpha 13 version, so if in your package.json you have already another version, you'll have to remove it, install angular2, and then install rjxs.

Update

The CHANGELOG was updated to show this breaking change. There's a comment from @jeffbcross in issue #5642 that clarifies a LOT in this matter.

Quoting part of that comment

Modularity was a goal of the new RxJS project from the start, and it wasn't until recently that we started really getting serious about composing operators instead of relying on tiered distributions of Rx.

Original answer

There was actually a breaking change regarding RxJS and Angular2. So now to use operators like map you have to import them separately. You can see the change in this pull request. And there's already an issue about your question.

I recommend you to stick to alpha 47. But to everyone who needs and want to know what the solution is, like in the pull request is specified, to add the operator separately.

You must have something like this

import {Http, ...} ...;

// Component
constructor(http: Http) {
    http.get(...).map() // 'map' doesn't exist! Ouch!
}

To fix it, add the operator (sorry for repeating it so many times) and configure the paths to rxjs

Note

This must be done with RxJS alpha 11, or alpha 12 (don't confuse it with @reactivex/rxjs, now it's just rxjs). So install it with

npm install rxjs@5.0.0-alpha.11

Or just npm install rxjs if you want the latest, although they lock it to be alpha 11.

Configure the paths in your System.config (note that this is my config, not necessarily the best and I'm assuming you installed alpha 11)

System.config({
    paths: {
        'rxjs/observable/*' : 'node_modules/rxjs/observable/*.js',
        'rxjs/operators/*' : 'node_modules/rxjs/operators/*.js',
        'rxjs/*' : 'node_modules/rxjs/*.js'
    }
});

After you are done with the configuration, you can import the operator as follows

 import 'rxjs/operators/map';

And that's all. You'll have to do that with every operator. So I repeat, I recommend you to stick to alpha 47, like I told you in the comment. I will try to update the answer later with a plnkr.

这篇关于角2的HTTP服务无法揭图（）等函数RxJS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！