In my app I am trying to implement a global toast that displays when no internet is detected and is dismissed when connection is brought back no matter where you are in the app. However I get an error after the second time the toast pops back up after losing connection: cannot read property ‘nativeElement’ of null. Also I am wondering if this is the best way to do this, heres the code:
ngOnInit() {
this.networkToast = this.toastCtrl.create({
message: 'No Internet Connection',
position: 'bottom'
});
// watch network for a disconnect
let disconnectSubscription = Network.onDisconnect();
disconnectSubscription.subscribe(() => {
this.networkToast.present()
});
// watch network for a connection
let connectSubscription = Network.onConnect();
connectSubscription.subscribe(() => {
this.networkToast.dismiss();
});
}
This code is in my app.ts or my root component, so no matter where you are in the app the listeners will always trigger when the network is connected or disconnected but the toast seems to throw the error. I tried adding timeouts right before presenting the toast along with onDidDissmissAll method. Any have this issue? Thanks in advance.