Angular2 中处理错误的最佳实践

Question

您好，我正在尝试接收从 catch 块（服务）发送的错误。在多个组件中，我需要显示一个弹出窗口，其中显示错误消息。请让我知道如何创建通用方法并在服务块中调用它。就像我现在用 "showErrorPage()".

做的一样

import { Injectable } from '@angular/core';
import { Http, Headers, Response, RequestOptions } from '@angular/http';
import { Observable } from 'rxjs';
import 'rxjs/add/operator/map'

@Injectable()
export class DataService {
    private reqData = {};
    private url: string;
    constructor(private http: Http) {
    }

    getResult(searchObject: {}): Observable<Response> {
        // some logic
        return this.http.post(<my url>, <data to be sent>)

        .map((response: Response) => {
            return response;
        })
        .catch((error: any) => {
            if (error.status === 302 || error.status === "302" ) {
                // do some thing
            }
            else {
              return Observable.throw(new Error(error.status));
            }
        });
    }
}

在我的组件中，我这样称呼它

import { Component,EventEmitter, Output, OnInit, OnDestroy } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
// importing DataService ';

@Component({
  selector: 'o-result',
  templateUrl: './o-result.component.html',
})

export class AComp implements OnInit {
    constructor(
        private dataService: DataService
    ){

    }

    ngOnInit() {
      this.dataService.getResult(<url>, <params>)
      .subscribe(
         response => {
             // doing logic with responce
         }
          ,
          error => {
            this.showErrorPage();
         }
      )

    }

    showErrorPage(): void {
      // displaying error in popup
    }
}

Answer 1

根据angular style guide

The details of data management, such as headers, HTTP methods, caching, error handling, and retry logic, are irrelevant to components and other data consumers.

您的实施似乎是正确的。

此外，http client 文档提供了相同的实现。

Angular2 中处理错误的最佳实践

Best practice for handling error in Angular2

angular2-services

angular