2

I'm trying to use ionic-alert with Angular deactivate keeping the behaviors of the "confirm" function.

canDeactivate(component: UserFormComponent) {
    if (component.userFormView.userForm.dirty) {
        this.confirmDeactivate();
    }

    return true;
}

private async confirmDeactivate() {
    const alert = await this.alertController.create({
        header: 'Confirm!',
        message: 'Message <strong>text</strong>!!!',
        buttons: [{
            text: 'Cancel',
            role: 'cancel',
            cssClass: 'secondary',
            handler: (blah) => {
                console.log('Confirm Cancel: blah');
            }
        }, {
            text: 'Okay',
            handler: () => {
                console.log('Confirm Okay');
            }
        }]
    });

    await alert.present();
}

With this code, when I click to change the page, the page changed then the confirm dialog appear.

When I use confirm() instead of this function, that works great, the page wait for the answer.

How can I do to get the same behaviors than the Window confirm function ?

Swarovski
  • 581
  • 2
  • 8
  • 25
  • canDeactive must **return** a boolean, a Promise or an Observable. What is returned tells Angular if it can deactivate or not. And you always return true immediately. So it deactivates. – JB Nizet Jan 12 '20 at 19:32
  • Yes, it's normal, I want to display the confirm dialog only if the form is dirty. Yes I have to return a boolean, but it doesn't do what I expect. – Swarovski Jan 12 '20 at 20:00
  • Read my comment again: you always return true. And true means: OK to deactivate. You need to return a Promise or an Observable resolved with/emitting true or false to tell Angular if it should or should not deactivate. – JB Nizet Jan 12 '20 at 20:34

0 Answers0