使用自定義錯誤處理程序捕獲Javascript錯誤后，Angular / Angular2數據綁定無法正常工作

Question

我正在使用Angular 2.4.9並實現了一個自定義錯誤處理程序，它只捕獲所有錯誤並導航到錯誤路由以顯示消息。

我有一個切換按鈕來顯示/隱藏綁定到布爾值的詳細消息（也嘗試了一個對象中的布爾值，即object.showError）如果我捕獲Http錯誤並自己拋出錯誤，所有工作正常。 但是，如果我遇到像ViewWrappedError這樣的Angular錯誤，數據綁定就會拒絕工作。 （點擊）evets仍然是函數，布爾值從true切換到false，只是更改沒有反映在頁面上。

我錯過了一些讓它起作用的東西嗎？

import { Component } from '@angular/core';
import { ErrorService } from './error.service';
import { Error } from './index';

@Component({
  moduleId: module.id,
  selector: 'error',
  templateUrl: 'error.component.html',
  styleUrls: ['error.component.css']
})

export class ErrorComponent {

  public error: Error;
  public showDetailedError: boolean;

  constructor(private errorService: ErrorService) {
    this.showDetailedError = false;
    this.error = this.errorService.getError();
  }
}

HTML模板

<div class="error-container">
  <h1>Sorry, something went wrong.</h1>
  <p class="error-message">An error occurred while processing your request.  Details on this error can be found below.</p>
</div>
  <p *ngIf="!showDetailedError" (click)="showDetailedError = !showDetailedError" class="info-icon">Click for detailed description</p>
</div>

Answer 1

沒有任何代碼很難確定問題，但我認為object.showError很可能是你的問題。

角度變化檢測知道組件屬性，但不知道復雜對象內部，特別是當它存在於數組對象中時。 嘗試移動該標志或使用getter函數綁定它。

Answer 2

您可以嘗試調用更改檢測：

@Injectable()
class MyExceptionHandler implements ExceptionHandler {
  constructor(private appRef:ApplicationRef) {}
  call(error, stackTrace = null, reason = null) {
    // do something with the exception
    this.appRef.tick();
  }
}

在更改檢測期間發生異常時，Angular會在ErrorHandler處理后繼續更改檢測。 明確地調用它可能會有所幫助。 我沒有嘗試過自己。
我不認為在異常后繼續使用應用程序是安全的。 自定義錯誤處理程序主要是一種報告異常的方法（例如，在服務器日志中），以便您可以在源中修復原因。

另請參見Angular 2：自定義ExceptionHandler更改檢測延遲