角度4 + zonejs：キャッチされていないエラーの後にルーティングが機能しなくなる

Question

ルーティング中にコンポーネント（コンストラクタまたはngOnInit）からキャッチされないエラーが発生した場合、ナビゲーションはそれ以降は機能しません。グローバルにErrorHandlerとRouterModuleのためのErrorHandlerがあっても

この問題が発生し、同様に確かにZoneListenerを追加 - ここapp.module.ts

に最小限の例を参照してください。 https://embed.plnkr.co/L19S3hKWyqgKUIT1EJlI/preview

メイクを必ずコンソールを開きます。 「Example Component」をクリックすると、ExampleFormComponentの強制エラーの結果としていくつかのスタックトレースが発生します。その後、「ホーム」に戻ることはできません。

予期せぬキャッチされていないエラーを処理して、アプリ全体を破壊しないようにするにはどうすればよいですか？

Answer 1

私のようないくつかの回避策を行うだろう：

let hasRouterError = false; 
@Injectable() 
export class MyErrorHandler implements ErrorHandler { 
    constructor(private inj: Injector) {} 

    handleError(error: any): void { 
    console.log('MyErrorHandler: ' + error); 

    if(hasRouterError) { 
     let router = this.inj.get(Router); 
     router.navigated = false; 
    } 

    //throw error; // it is necessarily otherwise handleError won't be executed during next error 
    } 
} 

export function MyRouterErrorHandler(error: any) { 
    console.log('RouterErrorHandler: ' + error); 
    hasRouterError = true; 
    throw error; 
} 

と、私たちは、カスタムRouteReuseStrategyを使用する必要があります。

export class PreventErrorRouteReuseStrategy implements RouteReuseStrategy { 
    shouldDetach(route: ActivatedRouteSnapshot): boolean { return false; } 
    store(route: ActivatedRouteSnapshot, detachedTree: DetachedRouteHandle): void {} 
    shouldAttach(route: ActivatedRouteSnapshot): boolean { return false; } 
    retrieve(route: ActivatedRouteSnapshot): DetachedRouteHandle|null { return null; } 
    shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean { 
    if(hasRouterError) { 
     hasRouterError = false; 
     return false; 
    } 
    return future.routeConfig === curr.routeConfig; 
    } 
} 

それはDefaultRouteReuseStrategy一つだけ、このコードから

if(hasRouterError) { 
    hasRouterError = false; 
    return false; 
} 

を異なりますそれをプロバイダのarrに追加することを忘れないでくださいAY：

import { RouteReuseStrategy } from '@angular/router'; 
... 
{ provide: RouteReuseStrategy, useClass: PreventErrorRouteReuseStrategy }, 

あなたはこの[問題]（https://github.com/angular/angular/issues/2413）を確認Modified Plunker