我一直在学习Angular 4,一切都顺利进行,直到我试图实施服务中的操控性。我正在尝试使用" RXJS"捕获和投掷,但是控制台中的功能错误。

import { Injectable } from '@angular/core';
import { Http } from "@angular/http";
import { Observable } from 'rxjs/observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';
import { AppError } from "../app/common/app.error";
import { NotFoundError } from "../app/common/not-found-error";
import { BadInput } from "../app/common/bad-input";

@Injectable()
export class PostService {
  private url = "https://jsonplaceholder.typicode.com/posts";

  constructor(private http: Http) { }

 deletepost(post){
      // return this.http.delete(this.url + '/' + post.id)
      // Hard-coded id to test 404
      return this.http.delete(this.url + '/' + 93498)
        .catch((error: Response) => {
          console.log('error within catch is ' + Response)
          if(error.status === 404)
            return Observable.throw(new NotFoundError(error));

          return Observable.throw(new AppError(error));
        });
    }
}

这是错误消息:

TypeError: __WEBPACK_IMPORTED_MODULE_2_rxjs_observable__["Observable"].throw is not a function. 
(In '__WEBPACK_IMPORTED_MODULE_2_rxjs_observable__["Observable"].throw(new 
__WEBPACK_IMPORTED_MODULE_6__app_common_not_found_error__["a" /* NotFoundError 
*/](error))', 
'__WEBPACK_IMPORTED_MODULE_2_rxjs_observable__["Observable"].throw' is 
undefined) --- post.service.ts:42

我的浏览器也有这样的警告:

./~/rxjs/Observable.js
There are multiple modules with names that only differ in casing.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Use equal casing. Compare these module identifiers:
* /Users/nickgowdy/Desktop/Angular2/angular4 source code/hello-world/node_modules/rxjs/Observable.js
    Used by 14 module(s), i. e.
    /Users/nickgowdy/Desktop/Angular2/angular4 source code/hello-world/node_modules/@angular/core/@angular/core.es5.js
* /Users/nickgowdy/Desktop/Angular2/angular4 source code/hello-world/node_modules/rxjs/observable.js
    Used by 1 module(s), i. e.
    /Users/nickgowdy/Desktop/Angular2/angular4 source code/hello-world/node_modules/@ngtools/webpack/src/index.js!/Users/nickgowdy/Desktop/Angular2/angular4 source code/hello-world/src/services/post.service.ts

答案

错误There are multiple modules with names that only differ in casing.表明错误的导入是针对您尝试使用的方式Observable

进口应该与资本" O"相似:

import { Observable } from 'rxjs/Observable';

这将导入个人Observable操作员,与运营商结合使用catch或者throw在创建的可观察物上。

import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';

要导入这样的完整可观察对象,您会以这样的方式导入它:

import { Observable } from 'rxjs/Rx'

Update:

带有RXJS(5.5+)运算符的较新版本,例如map()filter()可以用作可管道操作员结合pipe()而不是链接。

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

牢记诸如throw在JavaScript中保留/关键词,因此RXJSthrow运营商的导入为:

import { _throw } from 'rxjs/observable/throw';

Update:

对于RXJS(6+)的较新版本,请使用以下方式:

import { throwError } from 'rxjs';

并丢下这样的错误:

if (error.status === 404)
    return throwError( new NotFoundError(error) )

来自: stackoverflow.com