Angular 2 не обновляет вид после возникновения исключения

Когда исключение перехватывается обработчиком исключений Angular 2, пользовательский интерфейс больше не "обновляется".

У меня есть очень простой пример здесь:

import { Component, ExceptionHandler, Injectable, OnInit, provide } from '@angular/core';
import { bootstrap } from '@angular/platform-browser-dynamic';
import { Subject } from 'rxjs/Subject'

export interface Alert {
  message: string;
}

@Component({
  selector: 'my-app',
  template : '
  <h3>Parent</h3>
  {{aValue}}
  <br/>
  <br/>
  <button (click)='doIt()'>do it</button>
  <br/>
  <br/>
  <button (click)='breakIt()'>break it</button>
  '
})

export class App implements OnInit {
  private aValue: boolean = true
  constructor() { }
  
  alerts: Alert[] = [];
  
  doIt(){
    console.log('Doing It')
    this.aValue = !this.aValue
  }
  
  breakIt(){
    console.log('Breaking It')
    throw new Error('some error')
  }
}

bootstrap(App).catch(err => console.error(err));

Ответ 1

Так как angular 4.1.1 (2017-05-04) https://github.com/angular/angular/commit/07cef36

fix (core): не останавливать обнаружение изменений из-за ошибок

предотвращает отмену подписки из зоны при ошибке

предотвращает отмену подписки на директиву EventEmitter при ошибке

предотвращает снятие просмотров в режиме dev, если есть ошибка

гарантирует, что ngOnInit вызывается только 1x (также в режиме prod)

он должен работать без дополнительного кода

@Component({
  selector: 'my-app',
  template : `
    {{aValue}}
    <button (click)='doIt()'>do it</button>
    <button (click)='breakIt()'>break it</button>
  `
})

export class App implements OnInit {
  private aValue: boolean = true

  doIt(){
    console.log('Doing It')
    this.aValue = !this.aValue
  }

  breakIt(){
    console.log('Breaking It')
    throw new Error('some error')
  }
}

Пример плунжера

Ответ 2

Не полагайтесь на выполнение кода после того, как произошел необработанный Exception. Вы должны обрабатывать исключение в том месте, где вы ожидаете, что это произойдет.

Обработка ошибок: http://www.javascriptkit.com/javatutors/trycatch.shtml