Question

我正在尝试在我的Angular / Ionic项目中使用PhoneGap Connection API。我想要的是检查用户的网络，如果没有，我想显示特定的 div ，如果它不是NONE，请使用 ng显示另一个 div -show 指令。

到目前为止，这是我的代码：

controller.js

.controller('LoginCtrl', function($scope, CheckConnection) {

     $scope.net = CheckConnection.networkState();

})

.factory('cordovaReady', function() {
    return function (fn) {

        var queue = [];

        var impl = function () {
        queue.push(Array.prototype.slice.call(arguments));
    };

    document.addEventListener('deviceready', function () {
        queue.forEach(function (args) {
        fn.apply(this, args);
    });
    impl = fn;
    }, false);

   return function () {
       return impl.apply(this, arguments);
   };
 };
})

.factory('CheckConnection', function(cordovaReady) {
    return {
        networkState: cordovaReady(function() {
            var net = navigator.connection.type;

            if(net == 'none') {
                var internet = false;
            } else {
                var internet = true;
            }

            return internet;
        })  
    };  
})

view.html

<ion-nav-view name="login">
    <div ng-hide="LoginCtrl.net">
        NO CONNECTION {{net}}
    </div>
    <div ng-show="LoginCtrl.net">
        CONNECTED {{net}}
    </div>
</ion-nav-view>

我对Angular和PhoneGap很新，所以这个问题解决起来可能非常简单，但我无法理解:(任何帮助都会非常感激，谢谢！

Answer 1

试试这个：

<ion-nav-view name="login" ng-controller="LoginCtrl">
<div ng-hide="net">
    NO CONNECTION {{net}}
</div>
<div ng-show="net">
    CONNECTED {{net}}
</div>

Answer 2

好的，我找到了解决方案！ Angular有自己的方式检查连接，所以我甚至不需要PhoneGap。

这是我的新 controller.js ：

.controller('LoginCtrl', function($window, $scope ) {
     $scope.online = navigator.onLine;
     $window.addEventListener("offline", function () {
         $scope.$apply(function() {
             $scope.online = false;
         });
     }, false);
     $window.addEventListener("online", function () {
         $scope.$apply(function() {
             $scope.online = true;
         });
     }, false);
})

view.html

<ion-nav-view name="login">
    <div ng-hide="online">
        NO CONNECTION
    </div>
    <div ng-show="online">
        CONNECTED
    </div>
</ion-nav-view>

希望它可以帮助别人：D

尝试将Phonegap Connection API与AngularJS集成

2 个答案: