我正在使用 ionic 2 RC1 并使用 sublime 作为文本编辑器。我需要检查网络连接是否已连接。所以为此我使用了 ionic native Network以此目的。但我遇到了 Network.onDisconnect()
Observable 的问题。我编辑了 initializeApp()
方法,我在其中检查网络连接并在连接断开时显示警报。我在 app.component.ts
showAlert(title, msg) {
let alert = this.alertCtrl.create({
title: title,
subTitle: msg,
buttons: ['OK']
});
alert.present();
}
initializeApp() {
this.platform.ready().then(() => {
// Okay, so the platform is ready and our plugins are available.
// Here you can do any higher level native things you might need.
let disconnectSubscription = Network.onDisconnect().subscribe(() => {
this.showAlert("Error", "No internet connection");
});
StatusBar.styleDefault();
});
}
我面临的问题是,如果应用程序与互联网断开连接,警报会显示两次。我在这个 post 中发现了类似的问题但没有得到答复。在这方面的任何帮助将不胜感激。 提前致谢!
最佳答案
为了避免这种情况,您可以过滤事件,并在状态从在线变为离线,或从离线变为在线时做一些事情(而不是每次触发事件时)通过插件)。所以基本上你可以像这样创建一个服务来处理所有这些逻辑:
import { Injectable } from '@angular/core';
import { Network } from 'ionic-native';
import { Events } from 'ionic-angular';
export enum ConnectionStatusEnum {
Online,
Offline
}
@Injectable()
export class NetworkService {
private previousStatus;
constructor(private eventCtrl: Events) {
this.previousStatus = ConnectionStatusEnum.Online;
}
public initializeNetworkEvents(): void {
Network.onDisconnect().subscribe(() => {
if (this.previousStatus === ConnectionStatusEnum.Online) {
this.eventCtrl.publish('network:offline');
}
this.previousStatus = ConnectionStatusEnum.Offline;
});
Network.onConnect().subscribe(() => {
if (this.previousStatus === ConnectionStatusEnum.Offline) {
this.eventCtrl.publish('network:online');
}
this.previousStatus = ConnectionStatusEnum.Online;
});
}
}
因此我们的自定义事件(network:offline
和 network:online
)只会在连接真正发生变化时触发(修复多个在线或离线事件发生时的场景)当连接状态根本没有改变时由插件触发)。
然后,在您的 app.component
文件中,您只需订阅我们的自定义事件:
// Offline event
this.eventCtrl.subscribe('network:offline', () => {
// ...
});
// Online event
this.eventCtrl.subscribe('network:online', () => {
// ...
});
关于angular - IONIC 2 native Network.onDisconnect() 运行代码两次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42414277/