Navigate to page from global window callback seems to brake binding?


#1

Hi there,

i am struggling with a weird problem:
I am using the cordova-plugin-customurlscheme to open the app from a link in an email.
To handle the provided event and parse the Url one has to define a global callback function on the window object. (not very angularish, i know, but thats the way this plugin works)

To achieve this, i defined the global callback function inside the app.component.ts constructor (side note: this applies only if the app was already opened, as on app start the callback is fired before the ionic app is initialized; for explanation purpose i keep it that simpleā€¦):

export class MyApp {

  @ViewChild("rootNav")
  private navCtrl: NavController;

  constructor() {
     // override open handler to navigate on further custom url scheme actions
     (window as any).handleOpenURL = (url: string) => {
        setTimeout(() => {
          this.handleOpenUrl(url);
        }, 0);
      };
  }

  private handleOpenUrl(url: string) {
   // custom url parsing, etc...
  
   // navigate to page with reactive forms
    this.navCtrl.push(MyReactiveFormsPage, { param: "my param" });
  }
}

The MyReactiveFormsPage is opened successfully, but something is not properly working: the validation rules are not anymore evaluated on input changes but only on programmatically calling the valid property of the formgroup.
If i navigate to the page directly from the construtor the validation is working as expected.

Does anyone know whats going wrong here?
Is there any known issue regarding navigating to pages from a global callback method?
(or is there another more angularish approach to achieve this without the described problem?)

I already posted a question at the plugins issues page on github, but maybe this is more Ionic / Angular specificā€¦

global packages:

    @ionic/cli-utils : 1.4.0
    Cordova CLI      : 7.0.1
    Ionic CLI        : 3.4.0

local packages:

    @ionic/app-scripts              : 1.3.7
    @ionic/cli-plugin-cordova       : 1.4.0
    @ionic/cli-plugin-ionic-angular : 1.3.1
    Cordova Platforms               : browser 4.1.0 windows 5.0.0
    Ionic Framework                 : ionic-angular 3.3.0

System:

    Node       : v6.10.3
    OS         : Windows 10
    Xcode      : not installed
    ios-deploy : not installed
    ios-sim    : not installed
    npm        : 4.6.1

#2

Solved it myself.
The answer was so simple and an angular 2 basic: ever use NgZone.run(() => { ... }); when calling from outside the angular zone!
:slight_smile: