Angular 2 beta。17:属性'地图'在类型'Observable<Response>'

我刚刚从Angular 2 beta16升级到beta17,这又需要rxjs 5.0.0-beta.6。在beta16中,所有可观察对象/地图功能都工作得很好。我升级后出现以下错误,当typescript试图编译时发生:

  1. 属性“map”在类型“Observable”上不存在(在我使用map与可观察对象的任何地方)
  2. c:/path/node_modules/rxjs/add/operator/map.d.ts(2,16): error TS2435:环境模块不能嵌套在其他模块或命名空间中。
  3. c:/path/node_modules/rxjs/add/operator/map.d.ts(2,16): error TS2436:环境模块声明不能指定相对模块名。

我已经看到了这个问题/答案,但它没有解决问题:Angular2 beta的可观察错误。12和RxJs 5 beta.3

我的appBoot。Ts看起来像这样(我已经引用了rxjs/map):

///<reference path="./../node_modules/angular2/typings/browser.d.ts"/>
import {bootstrap} from "angular2/platform/browser";
import {ROUTER_PROVIDERS} from 'angular2/router';
import {HTTP_PROVIDERS} from 'angular2/http';
[stuff]
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';
import {enableProdMode} from 'angular2/core';
import { Title } from 'angular2/platform/browser';




//enableProdMode();
bootstrap(AppDesktopComponent, [
ROUTER_PROVIDERS,
HTTP_PROVIDERS,
Title
]);

有人知道是什么出了问题吗?

190255 次浏览

我把gulp-typescript插件升级到最新版本(2.13.0),现在它可以顺利编译了。

更新1:我以前使用gulp-typescript 2.12.0版本

更新2:如果你正在升级到Angular 2.0.0-rc。1、你需要在你的appBoot中执行以下操作。ts文件:

///<reference path="./../typings/browser/ambient/es6-shim/index.d.ts"/>
import { bootstrap } from "@angular/platform-browser-dynamic";
import { ROUTER_PROVIDERS } from '@angular/router-deprecated';
import { HTTP_PROVIDERS } from '@angular/http';
import { AppComponent } from "./path/AppComponent";
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';
// import 'rxjs/Rx'; this will load all features
import { enableProdMode } from '@angular/core';
import { Title } from '@angular/platform-browser';






//enableProdMode();
bootstrap(AppComponent, [
ROUTER_PROVIDERS,
HTTP_PROVIDERS,
Title
]);

重要的是引用es6-shim/index.d.ts

这假设你已经安装了es6-shim类型如下所示: enter image description here < / p >

关于Angular中安装类型的更多信息,这里:https://angular.io/docs/ts/latest/guide/typescript-configuration.html !#输入

看起来最新的RxJS需要typescript 1.8,所以typescript 1.7报告了上面的错误。

我通过升级到最新的typescript版本解决了这个问题。

如果你碰巧在VS2015中看到这个错误,这是一个github问题&这里提到的解决方案:

< a href = " https://github.com/Microsoft/TypeScript/issues/8518 issuecomment - 229506507 " > https://github.com/Microsoft/TypeScript/issues/8518 issuecomment - 229506507 < / >

这确实帮助我解决了property map does not exist on observable问题。 此外,确保你的typescript版本高于1.8.2

在我的情况下,只包括地图和承诺是不够的:

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';

我通过导入官方文档推荐的几个rxjs组件解决了这个问题:

1)在一个app/rxjs-operators中导入语句。ts文件:

// import 'rxjs/Rx'; // adds ALL RxJS statics & operators to Observable


// See node_module/rxjs/Rxjs.js
// Import just the rxjs statics and operators we need for THIS app.


// Statics
import 'rxjs/add/observable/throw';


// Operators
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/operator/distinctUntilChanged';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/switchMap';
import 'rxjs/add/operator/toPromise';

2)在你的服务中导入rxjs-operator本身:

// Add the RxJS Observable operators we need in this app.
import './rxjs-operators';

2016年9月29日更新Angular 2.0 FinalVS 2015

不再需要变通方法,只需安装TypeScript 2.0.3版本即可修复。

修复从这个github问题的评论上的编辑。

你需要导入map操作符:

import 'rxjs/add/operator/map'

从版本5过渡到版本6时,也会弹出类似的错误消息。以下是对rxjs-6更改的回答。

导入各个操作符,然后使用pipe而不是链接。

import { map, delay, catchError } from 'rxjs/operators';


source.pipe(
map(x => x + x),
delay(4000),
catchError(err => of('error found')),
).subscribe(printResult);

Rxjs 5.5“属性‘map’在Observable类型上不存在。

这个问题与您需要在所有操作符周围添加管道有关。

改变这一状况,

this.myObservable().map(data => {})

这个

this.myObservable().pipe(map(data => {}))

像这样导入映射,

import { map } from 'rxjs/operators';

它会解决你的问题。

import 'rxjs/add/operator/map';

,

npm install rxjs@6 rxjs-compat@6 --save

为我工作

正如Justin Scofield在他的回答中所建议的,对于Angular 5的最新版本和2018年6月1日的Angular 6,仅仅import 'rxjs/add/operator/map';不足以删除TS错误: [ts] Property 'map' does not exist on type 'Observable<Object>'. < / p > 必须运行以下命令来安装所需的依赖项: npm install rxjs@6 rxjs-compat@6 --save之后,map导入依赖错误得到解决!< / p >

在Angular 2x中

在example.component.ts

import { Observable } from 'rxjs';

在example.component.html

  Observable.interval(2000).map(valor => 'Async value');

在Angular 5x或Angular 6x中:

在example.component.ts

import { Observable, interval, pipe } from 'rxjs';
import {switchMap, map} from 'rxjs/operators';

在example.component.html

valorAsync = interval(2500).pipe(map(valor => 'Async value'));

据我所知,这是因为rxjs上次更新。他们改变了一些操作符和语法。之后,我们应该像这样导入rx操作符

import { map } from "rxjs/operators";

而不是这个

import 'rxjs/add/operator/map';

我们需要像这样在所有操作符周围添加管道

this.myObservable().pipe(map(data => {}))

源是在这里

如果你正在使用angular4,请使用下面的import。它应该会起作用。

导入“rxjs /添加/运营商/地图”;

如果你使用的是angular5/6,那么在管道下面使用map和import

Import {map} from "rxjs/operators";

对于那些使用angular 6的人来说,最后的答案是:

在你的* .service.ts文件中添加以下命令

import { map } from "rxjs/operators";


**********************************************Example**Below**************************************
getPosts(){
this.http.get('http://jsonplaceholder.typicode.com/posts')
.pipe(map(res => res.json()));
}
}

我正在使用 windows 10; < / p >

angar6与typescript V 2.3.4.0

我也遇到过类似的错误。当我做了以下三件事后,问题得到了解决:

  1. 更新到最新的rxjs:

    npm install rxjs@6 rxjs-compat@6 --save
    
  2. Import map and promise:

    import 'rxjs/add/operator/map';
    import 'rxjs/add/operator/toPromise';
    
  3. Added a new import statement:

    import { Observable, Subject, asapScheduler, pipe, of, from, interval, merge, fromEvent } from 'rxjs';
    

属性'map'在类型'observable response '中不存在

< p >解决方案: 更新Angular CLI和核心版本

ng update @angular/cli           //Update Angular CLi
ng update @angular/core          //Update Angular Core
npm install --save rxjs-compat   //For Map Call For Post Method