Http.delete TypeError: error.json is not a function

Question

在我的 angular 应用程序中，我有一个 delete button。单击后，它会显示一个弹出屏幕，询问用户是否确定要删除它。当他点击 'yes' 时，我向后端发送以下 http.delete 请求。

  Delete(id: number) {
    return this.http.delete('apiEndpoint/' + id)
    .map(res => res.json())
    .catch((error: any) => 
      Observable.throw(error.json().error || 'Server error' )
    );
  };

这个调用的正常结果是被删除的对象。但是，如果我的 if condition 在后端被触发，我 return 以下

return BadRequest(new { error = "error message" });

处理此错误后会导致 TypeError: error.json is not a function。

这是弹出窗口：

showPopup() {
this.popup.open(NguiMessagePopupComponent, {
  title: 'Delete',
  message: 'Are you sure you want to delete this?',
  buttons: {
    OK: () => {
      this.service.delete(this.someId).subscribe(() => {
        this.router.navigate(['someUrl']);
      },
      error => {
        alert(error);
      });
    },
    CANCEL: () => {
      this.popup.close();
    }
  }
});

这些是服务的所有导入：

import { Injectable } from '@angular/core';
import { Http, Response, RequestOptions, Headers } from '@angular/http';
import {HttpService} from './http-service.service';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/throw';
import 'rxjs/add/operator/map';
import { AppConfig } from '../app.config';
import { stringify } from 'querystring';
import { model } from 'models';

Answer 1

我认为您不需要再次调用 .json()，因为您已经在 .map(..) 调用中完成了。只需更改您的捕获代码以引用返回的对象，在您的情况下 error.error

Delete(id: number) {
    return this.http.delete('apiEndpoint/' + id)
       .map(res => res.json())
       .catch((error: any) => 
          Observable.throw(error.error || 'Server error' )
       );
};

除此之外您还可以添加

import 'rxjs/add/observable/throw';

给你的代码实现抛出函数。

Http.delete TypeError: error.json is not a function

Http.delete TypeError: error.json is not a function

http-delete

typescript

angular