catch 不适用于 http.get Angular2

Question

我正在尝试使用 Http 服务进行 ajax 调用，它工作正常。

现在我想处理失败的情况。例如，如果我们得到 404 或任何其他错误。

我正在使用以下代码。

import {Component,Inject} from '@angular/core';
import {Http, Response,HTTP_PROVIDERS} from '@angular/http';
import {DoService} from './service';
import 'rxjs/Rx';
import 'rxjs/add/operator/catch';

@Component({
    selector: 'comp-one',
    template: `<h2>My First Angular 2 App</h2>{{data}}
        <input type="button" (click)="doSomething()" value="Do Http"/>`
})

export class ComponentOne { 
    constructor(public _http:Http){
    console.log("It is from ComponentOne constructor..");
        this._http = _http;
    }
    data:Object;
    doSomething(){
        console.log("It is from doSomething ComponentOne");
        let temp:any = this._http.get('people.json')//people.json is not exist, intendedly maing any error
     .map(res => res.json())
        .catch((err:any)=>{ console.log("Something is wrong..")});// If i keep this line i am getting errors like "Argument of type '(err:any) => void' is not assignable to parameter of type '(err: any, caught: Observable<any>) => Observable<{}>"
        temp.subscribe(
        (res:any)=> {this.data = res._body; console.log(res)},
        (error:any)=>{ console.log("It isf from error..")},//It is not even getting called this block
        () => console.log('thire,,,ddjfladjfljasdlfj'));//In one of the forum they suggested to use this 3rd perameter, this is also not working for me.

  } 

}

Answer 1

你需要从 catch 块中返回 observable，因为这是 this 的签名。所以试试

return Observable.throw(new Error(error.status));

这里是sn-p

import {Observable} from 'rxjs/Rx';
...

return this.http.request(new Request(this.requestoptions))
    .map((res: Response) => {
        if (res) {
            if (res.status === 201) {
                return [{ status: res.status, json: res }]
            }
            else if (res.status === 200) {
                return [{ status: res.status, json: res }]
            }
        }
    }).catch((error: any) => {
        if (error.status === 500) {
            return Observable.throw(new Error(error.status));
        }
        else if (error.status === 400) {
            return Observable.throw(new Error(error.status));
        }
        else if (error.status === 409) {
            return Observable.throw(new Error(error.status));
        }
        else if (error.status === 406) {
            return Observable.throw(new Error(error.status));
        }
    });
}

另见

• How to deal with http status codes other than 200 in Angular 2

Answer 2

您可以尝试从catch 回调中返回Observable 对象，如下所示：

doSomething(){
  console.log("It is from doSomething ComponentOne");
  let temp:any = this._http.get('people.json')
     .map(res => res.json())
     .catch((err:any) =>{ 
        console.log("Something is wrong..");
        return Observable.of(undefined); <== this line 
     });

  temp.subscribe(
     (res:any)=> {this.data = res._body; console.log(res)},
     (error:any)=>{ console.log("It isf from error..")},
     () => console.log('thire,,,ddjfladjfljasdlfj'));
}