Angular 7-出现错误:'rxjs没有导出的成员'可观察'

时间:2018-12-17 09:57:06

标签: angular typescript rxjs angular7 rxjs6

这是我的package.json文件:

"dependencies": {
    "@angular/animations": "~7.1.0",
    "@angular/common": "~7.1.0",
    "@angular/compiler": "~7.1.0",
    "@angular/core": "~7.1.0",
    "@angular/forms": "~7.1.0",
    "@angular/material": "^7.1.1",
    "@angular/platform-browser": "~7.1.0",
    "@angular/platform-browser-dynamic": "~7.1.0",
    "@angular/router": "~7.1.0",
    "core-js": "^2.5.4",
    "ng2-opd-popup": "^1.1.21",
    "rxjs": "~6.3.3",
    "tslib": "^1.9.0",
    "zone.js": "~0.8.26"

service.ts文件代码如下:

import { Injectable } from '@angular/core';
import { Http, Headers} from '@angular/http';
import 'rxjs/add/operator/map';
//import { Observable } from 'rxjs/Observable';
//import   'rxjs/add/observable';
import { Observable} from 'rxjs';
@Injectable({
  providedIn: 'root'
})
export class EmpService {
  employees=[];
  constructor(private _http: Http) { }
  addEmployee(info){
    return this._http.post("http://localhost/data/insert.php",info)
      .map(()=>"");
  }
}

我遇到以下错误:

  

rxjs没有导出的成员“可观察”

版本中是否存在任何问题?

3 个答案:

答案 0 :(得分:3)

要与rxjs6和angular 7兼容,必须替换:

import { Http, Headers } from '@angular/http';
import 'rxjs/add/operator/map';

作者:

import { map } from 'rxjs/operators';
import { HttpClient, HttpHeaders } from '@angular/common/http';

并像这样导入可观察

import { Observable } from 'rxjs';

不是这样的:

import { Observable } from 'rxjs/Observable';
// or import   'rxjs/add/observable';

您可能需要删除node_modules文件夹并启动npm install,因为似乎其中包含错误的软件包。

答案 1 :(得分:2)

您的代码以旧的角度版本编写。所需的更改是

1. Use of Http is deprecated
2. importing map & Observable


import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { map } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class EmpService {
  employees=[];
  constructor(private _http: HttpClient) { }
  addEmployee(info){
    return this._http.post("http://localhost/data/insert.php",info)
      .pipe(
        map(() => '' )
      )

  }
}

引用:

答案 2 :(得分:0)

认为您的问题与错误的包装有关,因为您的操作方式正确。 在Angular 7中使用Observable的正确方法是通过import { Observable } from 'rxjs';

不确定是否在upgrade docs上从Angular 6升级了:

  

从HttpModule和Http服务切换到HttpClientModule和   HttpClient服务。 HttpClient简化了默认的人体工程学   (您不再需要映射到json),现在支持类型化返回   值和拦截器。进一步了解angular.io

     

使用rxjs-tslint自动更新规则删除不推荐使用的RxJS 6功能

     

对于大多数应用程序,这意味着要运行以下两个程序   命令:

     

npm install -g rxjs-tslint rxjs-5-to-6-migrate -p   src / tsconfig.app.json

     

一旦您和所有依赖项都更新为RxJS 6,请删除   rxjs-compat。

解决此问题后,运行npm install

另一种可能性被缓存node_modules,可以将其删除: git rm -r --cached node_modules 你可能有一些 因此,清理干净后,运行npm install,您应该拥有正确的软件包。