Cách truy cập các thuộc tính đối tượng trong chức năng bắt Angular 2 http rxjs với (điều này)

Question

Sử dụng dịch vụ http mới ở góc 2, tôi muốn làm nhiều hơn với lỗi của tôi hơn là chỉ ném lỗi trong bảng điều khiển. Thật không may, tôi dường như không thể truy cập các thuộc tính đối tượng của tôi từ bên trong hàm gọi lại bắt được.

tôi gọi dịch vụ http:

return this.http.get(this.apiUrl, options) 
      .map(this.extractData, this) 
      .catch(this.handleError) 

My HandleError callback fn:

handleError (error) { 
    console.log(this)//undefined! 
    if(error.status === 401){ 
    this.router.navigate(['/login'])//because `this` is undefined, this does not work 
    } 
    ... 
} 

Theo rxjs tài liệu, bắt không hỗ trợ một thisArg số thứ hai, đó là rất hữu ích trong bản đồ chức năng:

extractData(res) { 
    console.log(this)//returns the instance of my service class, which is what I want 
    this.someFunctionInMyService()//works great! In fact, I could call this.router.navigate if I wanted. 
    return res.json() 
} 

Vậy làm cách nào để gọi hoặc sử dụng tài sản dịch vụ của tôi từ trong cuộc gọi lại handleError?

Answer 1

Vấn đề của bạn là bạn tham chiếu một hàm trực tiếp để bạn mất ngữ cảnh của nó (this) khi thực hiện.

Để ngăn chặn việc này, bạn cần phải quấn phương pháp của bạn:

return this.http.get(this.apiUrl, options) 
     .map(this.extractData, this) 
     .catch(err => { 
      this.handleError(err); 
     }) 

hoặc tận dụng bind phương pháp:

return this.http.get(this.apiUrl, options) 
     .map(this.extractData, this) 
     .catch(this.handleError.bind(this) 

Nhưng có nhược điểm để sử dụng cách tiếp cận thứ hai với nguyên cảo kể từ khi bạn mất loại.

Xem liên kết này:

• https://basarat.gitbooks.io/typescript/content/docs/tips/bind.html