Ionic之监测网络连接
来源:互联网 发布:网络协议测试 编辑:程序博客网 时间:2024/05/12 13:44
今天发现目前的app项目还没有对网络连接做处理,于是研究了一下。趁现在搞定赶紧记录下来
在ionic中,我们需要用到codovaNetwork,这个插件输入如下命令引入:
cordova plugin add cordova-plugin-network-information
接下来放入我刚写的代码:
document.addEventListener('deviceready',function(){ $rootScope.isOnline = $cordovaNetwork.isOnline(); // 监听手机网络在线事件 $rootScope.$on('$cordovaNetwork:online', function(event, networkState){ $rootScope.isOnline = true; }) // 监听手机网络离线事件 $rootScope.$on('$cordovaNetwork:offline', function(event, networkState){ $rootScope.isOnline = false; }) //监听isOnline的变化,如果是离线,则点击button出现离线提示 $scope.$watch('isOnline',function(newValue,oldValue,scope){ console.log($rootScope.isOnline); $scope.email = function(){ if($rootScope.isOnline){ $state.go("register.re-email"); }else{ $scope.warnShow = "warnShow"; $timeout(function(){ $scope.warnShow = ""; },3000) } } //点击出现facebook登录模态框 $scope.showFbModal = false; $scope.openFbModal = function(){ //如果手机是在线,则button可任意点击 if($rootScope.isOnline){ $scope.showFbModal = true; $scope.slideUp = "slideUp"; }else{ $scope.warnShow = "warnShow"; $timeout(function(){ $scope.warnShow = ""; },3000) } } })
注意在控制器中引入
如下是我的当前页面:
当我的手机没有网络时,点击图中两个button会出现如下的提示框:
当我的手机有网络时,点击的”login with facebook ”,会是如下效果:
0 0
- Ionic之监测网络连接
- iOS之 网络连接监测框架 Reachability
- ionic 判断网络连接
- 监测当前网络连接状态
- IOS 监测网络连接状态
- ios网络连接状态监测
- iOS 监测网络连接状态
- ionic如何检测网络连接
- BroadcastReceiver监测网络连接的改变
- 使用netstat检测及监测网络连接
- iOS开发-监测网络连接状态
- 判断并监测网络连接状态
- 使用netstat检测及监测网络连接
- Determining and Monitoring the Connectivity StatusAndroid 电源管理专题之获取和监测网络连接状态
- Swift之网络编程-网络监测
- Android之监测网络状态的广播
- 网络状态监测之 Reachability的使用
- Android杂谈之网络实时监测
- eclipse 自动补全
- JMS-activemq概述
- java实现Base64加密解密
- 设计模式--[3]单例模式
- 简单理解认识yield表达式
- Ionic之监测网络连接
- 深入理解JavaScript系列(1):编写高质量JavaScript代码的基本要点
- 【FAQ】mysql 初始化 timestamp,提示 Invalid default value for 'xxx'
- ces
- Linux下添加lib库文件
- org.springframework.orm.hibernate3.support.OpenSessionInViewFilter
- mysql sql长度限制解决
- 级联训练器训练生成.xml文件后,检测
- 自学-Shiro的权限管理-12