Question

在我的角度应用中，我有delete button。点击它会显示一个弹出屏幕，询问用户是否确定要删除它。当他点击“是”时，我将以下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 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';

到你的代码来实现throw函数。

Http.delete TypeError：error.json不是函数

1 个答案: