Angular响应式开发中报错Property 'map' does not exist on type 'Observable'.引用rxjs也没用。

Angular响应式开发源代码如下：

import { Component, OnInit } from '@angular/core';
import {Observable} from 'rxjs';
// import { map } from 'rxjs/operators';
import {Http} from '@angular/http';@Component({selector: 'app-http',templateUrl: './http.component.html',styleUrls: ['./http.component.css']
})
export class HttpComponent implements OnInit {dataSource: Observable<any> ;products: Array<any> = [] ;constructor(private http: Http) {this.dataSource = this.http.get('/products').map((res) => res.json());}ngOnInit() {this.dataSource.subscribe((data) => this.products = data);}
}

程序运行时报错：

ERROR in src/app/http/http.component.ts(17,8): error TS2339: Property 'map' does not exist on type 'Observable<Response>'.

即使引入import ‘rxjs/add/operator/map’ ，以及import ‘rxjs/Rx’;也同样出现这种错误。
查阅资料可通过以下方法解决：通过npm install rxjs-compat 命令安装rxjs-compat ，然后重新启动项目，引入import ‘rxjs/add/operator/map’;即可解决。

D:\workDirectory\Angular2\http\http>npm install rxjs-compat
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32"
,"arch":"x64"})+ rxjs-compat@6.3.3
added 1 package and audited 39134 packages in 35.126s
found 0 vulnerabilities

参考：
https://blog.csdn.net/qq_41348754/article/details/81106265

Angular响应式开发中报错Property 'map' does not exist on type 'Observable'.引用rxjs也没用。相关推荐

Angular使用ng build打包报错 Property 'setControl' does not exist on type 'AbstractControl'.解决方法
在项目打包出现setControl报错解决方法: 对于用setControl设置多层级表单的值的用法,会出现这个报错: 以下是正确的写法: get services(): FormArray {ret ...
Property 'filter' does not exist on type 'Observable' 报错解决方法
我想做的是监听地址参数变化: import 'rxjs/operator/filter';//...this.router.events.filter((event:Event) => even ...
响应式编程时出现：error TS2339: Property 'debounceTime' does not exist on type 'Observableany'.
constructor() {this.searchInput.valueChanges//.debounceTime(500) 无法使用.pipe(debounceTime(1000)).subsc ...
关于angular开发中报错Cannot find module ‘webpack/lib/node/NodeTemplatePlugin‘问题的解决办法若干
关于angular开发中报错Cannot find module 'webpack/lib/node/NodeTemplatePlugin'问题的解决办法若干参考文章: (1)关于angular开发 ...
springboot 使用webflux响应式开发教程（二）
本篇是对springboot 使用webflux响应式开发教程(一)的进一步学习. 分三个部分: 数据库操作 webservice websocket 创建项目,artifactId = tradin ...
灵雀云前端： Angular 响应式表单
Kubernetes 对象实战简介 Kubernetes 集群的使用者日常工作中经常需要与 Deployment 等 Kubernetes 对象接触.熟悉 Kubernetes 的朋友都会知道,Ku ...
Angular 响应式表单
Kubernetes 对象实战简介 Kubernetes 集群的使用者日常工作中经常需要与 Deployment 等 Kubernetes 对象接触.熟悉 Kubernetes 的朋友都会知道,Ku ...
linux字体栅格化,响应式开发---网页的布局方式、媒体查询、栅格化布局、less语言...
1.响应式开发介绍 a.网页布局方式 b.响应式布局优点:用一个页面适配不同终端的展示缺点:产生代码冗余,同时使网页体积变得很庞大,不会因为终端的改变而改变网页的体积,不同终端上有些没有显示出来的 ...
用rem来做响应式开发
电脑版的商城昨晚做完了,今天赶着做手机端的,提到手机端的网站第一个想到的就是要适应不同手机屏幕的宽度,保证在不同手机上都能正常显示给用户,我之前做这类网站都是无脑引进bootstrap的.但前一个项 ...

Angular响应式开发中报错Property 'map' does not exist on type 'Observable'.引用rxjs也没用。

Angular响应式开发中报错Property 'map' does not exist on type 'Observable'.引用rxjs也没用。相关推荐

最新文章

热门文章