25

次のようなことをしているチュートリアルがたくさんあります。

http.get("...").subscribe(
  success => console.log('hello success'),
  error => console.log('bye error')
);

タイプも何もないので、これがどのように機能するのかわかりませんが自分でやろうとしたところ、エラーが発生してもリクエストは常に成功します。何が問題ですか?

トラブルメーカー:

this.memberService.create(this.currentMember)
      .subscribe(
        success => {
          let mem: Member = success.json() as Member;
          if (this.selectedOrganization) {
            this.addMemberToOrganization(mem);
          } else if (this.selectedServiceProvider) {
            this.addMemberToServiceProvider(mem);
          } else {
            this.toastsService.error("lbl_users_service_provider_and_organization_undefined");
          }
        },
        error => console.log(error)
      );

memberService の Create-Method:

  create(member: Member): Observable<any> {
    return this.http
      .post(this.RESOURCE_BASE_URL, member)
      .map(response => {
        if (response.status === 200) this.toastsSerivce.success(this.translateService.instant('lbl_users_member_created'));
        return response;
      })
      .catch(error => this.toastsSerivce.error(this.translateService.instant('lbl_users_member_create_failed')));
  }

エラーもキャッチしますが、そのsubscribe部分は気にしないようです。success.json()エラーがある場合は がないため、 で失敗しますjson。ただし、エラーが発生した場合は、のerror =>...代わりにを呼び出すようにしsuccessます。どんなアドバイスでも大歓迎です。

4

2 に答える 2

16

問題は、あなたがthrowingエラーではないということだと思いますObservable.throw(errMsg)

したがって、次のように使用できます。

.catch((error:any) => Observable.throw(error.json().error || 'Server error'));

あなたの例では:

create(member: Member): Observable<any> {
    return this.http
      .post(this.RESOURCE_BASE_URL, member)
      .map(response => {
        if (response.status === 200) this.toastsSerivce.success(this.translateService.instant('lbl_users_member_created'));
        return response;
      })
      .catch((error:any) => Observable.throw(this.toastsSerivce.error(this.translateService.instant('lbl_users_member_create_failed'))));
  }

ただし、Angular がここで提案するようなエラー ハンドラを使用できます。

private handleError (error: Response | any) {
    // In a real world app, you might use a remote logging infrastructure
    let errMsg: string;
    if (error instanceof Response) {
      const body = error.json() || '';
      const err = body.error || JSON.stringify(body);
      errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
    } else {
      errMsg = error.message ? error.message : error.toString();
    }
    console.error(errMsg);
    return Observable.throw(errMsg);
  }

したがって、メソッドは次のようになります。

create(member: Member): Observable<any> {
    return this.http
      .post(this.RESOURCE_BASE_URL, member)
      .map(response => {
        if (response.status === 200) this.toastsSerivce.success(this.translateService.instant('lbl_users_member_created'));
        return response;
      })
      .catch(this.handleError);
  }

実際には、サービス内で作成する可能性のある他のメソッドに対してよりクリーンで再利用可能です。

Angular の開発者が使用するような応答ハンドラも使用することをお勧めします: this.extractData

明らかに、エラー ハンドル メソッド内に独自のカスタム ロジックを配置できます。これは、エラーを表示または処理する方法によって異なります。

注:あなたのコードもここに投稿したコードもテストしていません。でもコンセプトは見せたい/表現したかった。everytimeに入らないようにするには、エラーをスローする必要がありますsuccess。それをどのように処理するかは、あなたとあなたのアプリによって異なります。

于 2017-06-06T09:36:31.513 に答える
4

わたしにはできる:

this.http.post('http://example.com/path/', {sampleData: 'd'}).subscribe(
  res => {alert('ok!');},
  err => {alert(err.error)}
)
于 2019-09-08T09:17:07.883 に答える