change - ¿Hay algún gancho de ciclo de vida como window.onbeload en Angular2?

router events angular 6

Question

¿Hay algún gancho de ciclo de vida como window.onbeload en Angular2? Ya busqué en Google y busqué en stackoverflow, pero no encontré nada

Answer 1

La respuesta de Günter Zöchbauer es ligeramente errónea en dos casos, esto es lo que funcionó para mí:

@Component({ 
  selector: ''xxx'',
  ..
)}
class MyComponent {
  @HostListener(''window:beforeunload'', [''$event''])
  doSomething($event) {
    if(this.hasChanges) $event.returnValue=''Your data will be lost!'';
  }
}

Hay dos diferencias principales en la respuesta de Günter:

1. El argumento de @HostListener debe ser window:beforeunload y no window:onbeforeunload
2. El manejador no debe devolver el mensaje, sino que debe asignarlo a $event.returnValue en $event.returnValue lugar

Answer 2

<div (window:beforeunload)="doSomething()"></div>

o

@Component({ 
  selector: ''xxx'',
  host: {''window:beforeunload'':''doSomething''}
  ..
)}

o

@Component({ 
  selector: ''xxx'',
  ..
)}
class MyComponent {
  @HostListener(''window:beforeunload'')
  doSomething() {
  }
}

Así es como escuchar eventos globales. No sé si el comportamiento especial de este evento es compatible cuando el valor de retorno se utiliza como texto para el diálogo de conformación.

Todavía puedes usar

export class AppComponent {  
  constructor() {
    window.onbeforeunload = function(e) {
      return ''Dialog text here.'';
    };
  }
}

Como se explica aquí https://developer.mozilla.org/de/docs/Web/API/WindowEventHandlers/onbeforeunload