onchange() method not working

[JaneDawson]

I'm developing a mobile app using Ionic 2. I want to implement a function that sets a flag to true if the user is logged in to a certain wifi network. Otherwise the flag is to be set false. It is important that the flag is permanently updated when the network connection changes and even if the app is running in background.

Therefore I want to use the Ionic Native Network Plugin and it's "onchange()" method. I tried to put this to Ionic's "app.component.ts" in the "initializeApp()" method like this:

initializeApp() {
   ...
   // set connection change observable
      Network.onchange().subscribe( () => {
        console.log('network connection changed!');
        this.setUserActivityIndicatorWithDelay();
      }, error => {
        console.log("Error in Network.onchange() method.")
        this.errorService.handleError(error);
      });
   ...
}

The observable seems not to be notified when the network changes (i.e. change to another wifi or disconnect wifi). However, when I use "onConnect" it seems to work.

Is this a bug in onchange()? Or am I doing something wrong here?

Additionally: Did I put it at the wrong place? Where would you put the call of the Network.onchange() method, if not to initializeApp()? Important: The observable needs to be called in all cases, even if the app is running in background!

Thank you, guys!

[bgondy]

Check #1043.

[JaneDawson]

Hi bgondy. As far as I can see, this is supposed to be closed and updated? I'm using the current version 2.8.0 of ionic-native.

[bgondy]

I have no idea if they have published a new release with the fix, maybe in v2.8.1. If not, you can still use the workaround I've posted.

[JaneDawson]

I guess it's published. At least before I updated ionic-native, I received the error "no such method", as posted in the other issue. After updating ionic-native to 2.8.0 I didn't receive this error anymore, so I assumed the fix is published. But nothing else happens, as well ;-)
Your workaround is already in use - it's working fine with onConnect and onDisconnect - thank you for that.

[kamok]

I'm using 3.10.3 and I'm getting a TypeScript error this.connectivityService.onChange(...).subscribe is not a function. Any ideas?

In my connectivityService, I have this:

  onChange(): Observable<any> {
    return this.network.onchange();
  }

I wrote this to mimic the behavior of onchange() for now:

  onChange(): Observable<boolean> {
    return new Observable((observer) => {
      // emit starting state
      observer.next(this.isOnline());
      this.network.onConnect().subscribe(() => {
        observer.next(true);
      });
      this.network.onDisconnect().subscribe(() => {
        observer.next(false);
      });
    });
  }

[danielsogl]

I copy pasted the example from.the docs and had no error. Are you sure that you try to access the plugin AFTER platform.ready()?

[kamok]

@danielsogl Yes, everything is after platform.ready(), inside a .then.

Here's my ionic info:

global packages:

    @ionic/cli-utils : 1.3.0
    Cordova CLI      : 6.5.0
    Ionic CLI        : 3.3.0

local packages:

    @ionic/app-scripts              : 1.3.7
    @ionic/cli-plugin-cordova       : 1.3.0
    @ionic/cli-plugin-ionic-angular : 1.3.0
    Cordova Platforms               : android 6.1.2
    Ionic Framework                 : ionic-angular 3.3.0

System:

    Node       : v6.9.1
    OS         : OS X El Capitan
    Xcode      : Xcode 8.2.1 Build version 8C1002
    ios-deploy : 1.9.1
    ios-sim    : 5.0.13

[ashley-s]

Hello my mistake added the function to the mock class. I forgot because it was running in the browser.