onbeforeunload confirm dialog not showing when angular2 @HostListener is used

angular angular2-hostbinding
raneshu picture raneshu · Mar 23, 2017 · Viewed 26.5k times · Source

Using @HostListener hook, but confirm dialog (that asks: Do you want to Leave this page? ...or Do you want to Reload this page?) is not showing.

The code works, but the confirm dialog is not showing.

Here what I have: 

@HostListener('window:beforeunload', ['$event'])
public doSomething($event) {
    console.log("do I see this?") // <---- this logs to the console.

    return "something else";
}

But I don't see this:

enter image description here

Answer

raneshu picture raneshu · Mar 24, 2017

returning false instead of the string "something else" fixes the problem and the confirm dialog is shown.

It's quite possible that angular bindings modify the return value

Related questions

Angular 2: Get position of HTML element

I'm trying to implement a custom directive in Angular 2 for moving an arbitrary HTML element around. So far everything is working except that I don't now how to get the initial position of the HTML element when I click on …

Read More
Inject Style Declarations Using Hostbinding in Angular

Do you guys know how I can batch inject style declarations in a component using the @HostBinding decorator? What I am trying is: @HostBinding('style') get style(): CSSStyleDeclaration { return { background: 'red', color: 'lime' } as CSSStyleDeclaration; } In my understanding this should …

Read More
Use @HostBindings instead host in angular 4

I just try to make animation with angular 4 and I saw tutorial that use host in the component import { Component, OnInit, HostBinding } from '@angular/core'; import { AngularFire, AuthProviders, AuthMethods } from 'angularfire2'; import { Router } from '@angular/router'; import { …

Read More