Angular2：ng2-resource-rest 响应错误处理答案

【问题标题】：Angular2 : ng2-resource-rest response error handlingAngular2：ng2-resource-rest 响应错误处理
【发布时间】：2017-07-20 09:13:40
【问题描述】：

如何使用 ng2-resource-rest 和 typeScript 处理 Angular2 中的 400/500 状态等休息调用错误？

register.component.ts

registerEmployees() {
    let regEmployee = this.empService.employeeRegister(this.register);
    regEmployee.$observable
        .subscribe(
        (data: any) = > {
        regEmployee = data;
    }
    ),
        (error: any) = > {
        // I also made a layer to parse errors
    };
}

employee.service.ts

import{ Injectable } from '@angular/core';
import{ RequestMethod, Response } from '@angular/http';

import{ ResourceAction, ResourceMethod, ResourceParams } from 'ng2-resource-rest';
import{ RestClient } from './global/rest-client';

@Injectable()
@ResourceParams({
url: 'http://localhost:8080/api/v1'
})
export class EmployeeServiceService extends RestClient {

    @ResourceAction({
    method: RequestMethod.Post,
        path : '/employee'
    })
    employeeRegister: ResourceMethod<any, any>;

}

【问题讨论】：

标签： angular typescript ng2-resource-rest

【解决方案1】：

试试这个。

 http
  .get('Some Url')
  .map(res => {
   // If request fails, throw an Error that will be caught
    if(res.status < 200 || res.status >= 300) {
     throw new Error('This request has failed ' + res.status);
   } 
   // If everything went fine, return the response
   else {
     return res.json();
   }
 })
.subscribe(
    (data: any) => {
          regEmployee = data;
     }
  )

【讨论】：

if 子句前抛出异常
什么异常！？

【解决方案2】：

事实上，您有 Response 对象作为 error，您可以使用它来处理错误

registerEmployees() {
    let regEmployee = this.empService.employeeRegister(this.register);
    regEmployee.$observable
        .subscribe(
           (data: any) = > {
             // it's not need to set data, data is already set to the object
             //regEmployee = data;
           },
           (error: Response) => {
           // I also made a layer to parse errors
             if (error.status === 400) {
               console.log('My error JSON', error.json());
               console.log('My error TEXT', error.text()); 
             }

           }
        );
}

PS：我已经发布了新版本，并且它被重命名为 ngx-resource

【讨论】：