inAppBrowser listener

Ionic Native
1

Hi, I have a page which has a button with a [disabled] property, as:

<button ion-button block (click)="button_clicked()" [disabled]="disable_buttons">A button</button>

After pressing it, I disable the button and open an inAppBrowser, which once is closed, modifies the [disabled] attribute to make the button enabled back again:

    button_clicked(){

// disable the button
      this.disable_buttons = true;

      const options:InAppBrowserOptions = {
        location: 'no',
        hidden: 'no',
        clearcache: 'yes',
        clearsessioncache: 'yes',
        footer:'yes',
        zoom:'no'
      }

    const browser = this.inappbrowser.create(url, '_self', options);

    browser.on('exit').subscribe(
// enable the button
        (event:InAppBrowserEvent) => {this.disable_buttons = false;}
      );

    browser.show();
}

The problem is that, while the .on('exit') subscription executes successfully -that is, executes the line this.disable_buttons=false;, on the UX, the button remains as disabled.

Any hints?

Thanks

2

Try to run this code inside ngZone

constructor(private ngZone: NgZone) {}
...
browser.on('exit').subscribe(
  // enable the button
  (event:InAppBrowserEvent) => {
  this.ngZone.run(() => {
    this.disable_buttons = false;
  });
  }
);
3

I will check it out.

Following your answer on ngZones, I reached this discussion: https://forum.ionicframework.com/t/ngif-not-working-with-subscribe-if-i-dont-use-ngzone/132742

4

There’s an alternative to ngZone manipulation in this SO thread, by manually launching the change detector (adding it here also for future reference):
https://stackoverflow.com/questions/50348907/ionic-3-and-ngzone-is-not-working-not-updating-the-results-to-html-view