我正在使用cordova-plugin-network-information
插件来检测Ionic 3应用中网络连接的变化。
目前,我创建了一个名为network-status
的组件,它注入ToastController
并在状态更改时显示Toast消息。这是代码:
import { Component } from '@angular/core';
import { Network } from '@ionic-native/network';
import { ToastController, Toast } from 'ionic-angular';
@Component({
selector: 'network-status',
templateUrl: 'network-status.html'
})
export class NetworkStatusComponent {
status: string;
constructor(private _toastCtrl: ToastController, private _network: Network) {
let noInternetToast: Toast;
let onlineToast: Toast;
this._network.onDisconnect().subscribe(() => {
noInternetToast = this._toastCtrl.create({
message: 'No Internet Connection ',
position: 'top',
cssClass: 'failure'
});
noInternetToast.present();
});
this._network.onConnect().subscribe(() => {
// TODO: figure out way to reload current view
onlineToast = this._toastCtrl.create({
message: 'Back online ',
position: 'top',
duration: 2000,
cssClass: 'success'
});
noInternetToast.dismiss();
onlineToast.present();
});
}
}
当连接重新联机时,我想刷新用户当前所在的任何视图。目前,<network-status>
组件已嵌入app.html
。
运行Ionic 3.6.0和Angular 4.3.6。
谢谢!