angular 2 应用程序中的 HTTP 响应处理

Question

使用 angular 2 HTTP PUT 请求。我有一个组件和服务。在组件中，我请求更新帐户的属性。然后它调用服务通过 API 更新帐户。响应时，我正在尝试从响应中接收状态代码和状态消息。

这是服务代码，

let headers = new Headers({ 'Content-Type': 'application/json' }); // ....Set content type to JSON
      let options = new RequestOptions({ headers: headers });
      return this.http.post((('http://192.168.16.89:')+this.globalData.port1+('/api.spacestudy.com/spacestudy/') +
                           this.globalData.institutename + ('/admin/account/saveattributes')),
       this.account, options)
        .map((success: Response )=>this.success=success.status,
        )

        .catch(this.handleError);
    }

   private handleError (error: Response | any) {
  this.errorStatus=error.status;
  console.error(error.message || error);
  return Observable.throw("error status is "+this.errorStatus);
    }

此代码用于组件 class、

this.accountDetailService.updateAccountData(this.nAccountId,this.nDeptId,this.sLocation,this.nAccountCPCMappingid,
      this.nInvestigatorId,this.sAcctDesc,this.sClientAcctId)
      .subscribe(successCode => {
         this.statusCode= successCode;
        console.log("Success: "+ this.statusCode);
       console.log("Successfully Updated")
         },
    errorCode => {this.statusCode = errorCode;
       console.log("Error code is : "+ this.statusCode);
    });

这是我的 html 代码，我试图在其中打印带有特定消息的状态代码，

<div *ngIf="statusCode" >
     <div *ngIf="statusCode === 200" class="successResponse" [ngClass] = "'success'">
        Account Updated successfully.
   </div> 
   <div *ngIf="statusCode === 404" class="errorResponse" [ngClass] = "'error'">
        Data Retrieval Failure
   </div>       

   <div *ngIf="statusCode == 405" class="errorResponse"  [ngClass] = "'error'">
        REquested Method type not supported.
   </div>          
   <div *ngIf="statusCode === 406"  class="errorResponse" [ngClass] = "'error'">
        You can not pass null parameter.
   </div>
   <div *ngIf="statusCode === 500" class="errorResponse"  [ngClass] = "'error'">
       Internal Server Error.
   </div>   
 </div>

这是我收到的回复，

Response {_body: "{"statusCode":405,"message":"You cannot make this …estudy/rockefeller/admin/account/saveattributes"}", status: 405, ok: false, statusText: "OK", headers: Headers, …}
headers
:
Headers {_headers: Map(4), _normalizedNames: Map(4)}
ok
:
false
status
:
405
statusText
:
"OK"
type
:
2
url
:
"http://192.168.16.89:8081/api.spacestudy.com/spacestudy/rockefeller/admin/account/saveattributes"
_body
:
"{"statusCode":405,"message":"You cannot make this request - the method is not allowed!","status":"Request method 'POST' not supported","error":"/api.spacestudy.com/spacestudy/rockefeller/admin/account/saveattributes"}"
__proto__
:
Body

我没有找到从响应中提取数据的正确方法。我的回答是正确的，但我无法在浏览器上访问它。请任何人消除我的疑虑并指导我解决问题。

Answer 1

我解决了这个问题。 throw 的导入语句有错误。我还稍微修改了我的 Errorhandler 方法，如下所示，

private handleError (error: Response | any) {
  this.errorStatus=error._body;
  console.error(error._body|| error);
  return Observable.throw(error.status);

angular 2 应用程序中的 HTTP 响应处理

HTTP Response handling in angular 2 application

angular2-services

angular2-http