angular - 验证 ionic2 互联网连接的变化

Question

我看到这个教程来确定 ionic2 中的网络可用性: https://www.thepolyglotdeveloper.com/2016/01/determine-network-availability-in-an-ionic-2-mobile-app/

但我的问题是:有一种方法可以在网络状态发生变化时“自动”显示对话框(不使用 Observable.period())？

谢谢!

Answer 1

在 Network Information plugin 的文档中您可以看到该插件发出 2 个事件:如果设备离线，则为“离线”；如果设备在线，则为“在线”。我们可以使用这两个事件来创建 Observables。在此主页中，我创建了 2 个可观察对象，在订阅中，我创建了显示警报的函数。首先，我需要来自 rxjs 的 Observable，并且还需要导入 fromEvent 方法。

import {Page, Alert, NavController} from 'ionic-angular';
import {Observable} from 'rxjs/Observable';
import 'rxjs/add/observable/fromEvent';

@Page({
    templateUrl: 'build/pages/home/home.html'
})
export class HomePage {

constructor(public nav:NavController) {
    var offline = Observable.fromEvent(document, "offline");
    var online = Observable.fromEvent(document, "online");

    offline.subscribe(() => {
        let alert = Alert.create({
            title: "Connection",
            message: "You are offline!"
        });
        nav.present(alert);
    });

    online.subscribe(()=>{
        let alert = Alert.create({
            title: "Connection",
            message: "You are online!"
        });
        nav.present(alert);
    });
  }
}