如何检查互联网连接在AngularJs

前端之家收集整理的这篇文章主要介绍了如何检查互联网连接在AngularJs前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
这是我如何检查互联网连接在vanilla javascript:
setInterval(function(){
    if(navigator.onLine){
        $("body").html("Connected.");
    }else{
        $("body").html("Not connected.");
    }
},1000);

我在我的项目中有角度控制器和模块。我应该把代码放在哪里?它应该在全局上下文中执行,而不是分配给某个控制器。是否有某种全局控制器可能?

首先,我建议你听 online/offline events

你可以这样在AnguarJS中:

var app = module('yourApp',[]);

app.run(function($window,$rootScope) {
      $rootScope.online = navigator.onLine;
      $window.addEventListener("offline",function() {
        $rootScope.$apply(function() {
          $rootScope.online = false;
        });
      },false);

      $window.addEventListener("online",function() {
        $rootScope.$apply(function() {
          $rootScope.online = true;
        });
      },false);
});

注意:我包装更改根范围的变量在$ apply方法通知Angular的东西已更改。

之后,您可以:

在控制器:

$scope.$watch('online',function(newStatus) { ... });

在HTML标记中:

<div ng-show="online">You're online</div>
 <div ng-hide="online">You're offline</div>

这是一个工作的Plunker:http://plnkr.co/edit/Q3LkiI7Cj4RWBNRLEJUA?p=preview

其他解决方案可以是广播在线/离线事件。但在这种情况下,您需要在加载时初始化当前状态,然后订阅事件。

原文链接:https://www.f2er.com/angularjs/146347.html

猜你在找的Angularjs相关文章