Angular 2 - Xử lý lỗi

Ứng dụng Angular 2 có tùy chọn xử lý lỗi. Điều này được thực hiện bằng cách bao gồm thư viện ReactJS catch và sau đó sử dụng hàm catch.

Hãy xem mã cần thiết để xử lý lỗi. Mã này có thể được thêm vào đầu chương cho các hoạt động CRUD sử dụng http.

Trong tệp product.service.ts, hãy nhập mã sau:

import { Injectable } from '@angular/core'; 
import { Http , Response } from '@angular/http'; 
import { Observable } from 'rxjs/Observable'; 

import 'rxjs/add/operator/map'; 
import 'rxjs/add/operator/do'; 
import 'rxjs/add/operator/catch'; 
import { IProduct } from './product';  

@Injectable() 
export class ProductService { 
   private _producturl = 'app/products.json'; 
   constructor(private _http: Http){}  

   getproducts(): Observable<IProduct[]> { 
      return this._http.get(this._producturl) 
      .map((response: Response) => <IProduct[]> response.json()) 
      .do(data => console.log(JSON.stringify(data))) 
      .catch(this.handleError); 
   }  
   
   private handleError(error: Response) { 
      console.error(error); 
      return Observable.throw(error.json().error()); 
   } 
}
  • Hàm catch chứa liên kết đến hàm Xử lý lỗi.

  • Trong chức năng xử lý lỗi, chúng tôi gửi lỗi đến bảng điều khiển. Chúng tôi cũng ném lỗi trở lại chương trình chính để quá trình thực thi có thể tiếp tục.

Bây giờ, bất cứ khi nào bạn gặp lỗi, nó sẽ được chuyển hướng đến bảng điều khiển lỗi của trình duyệt.