Ionic + ngCordova + фоновая геолокация + DeviceReady выпуск

0

Я пытаюсь получить фоновый плагин геолокации для работы в моем приложении; однако, когда я использую функцию deviceready, страница иногда загружается на моем устройстве. Из моего googling кажется, что я должен использовать $ ionicPlatform.ready вместо этого, но $ cordovaBackgroundGeolocation не определен, когда я пытаюсь это сделать. Точно так же устройство всегда не определено, когда я пытаюсь что-либо с ним делать.

Я также попробовал вручную бутстрапинг угловой, это не сработало; и я попробовал просто запустить функцию, не помещая ее в deviceready или $ ionicPlatform.ready или что-то еще; это тоже не сработало.

Код, о котором идет речь:

контроллер:

// Define the angular module
angular.module('testApp.controllers', ['ionic', 'ngCordova.plugins.geolocation', 'ngCordova.plugins.backgroundGeolocation'])

.controller('MapCtrl', ['$scope', '$ionicPopup', '$cordovaGeolocation', '$cordovaBackgroundGeolocation', '$timeout', '$http', '$ionicPlatform', 
               function ($scope, $ionicPopup, $cordovaGeolocation, $cordovaBackgroundGeolocation, $timeout, $http, $ionicPlatform) {
    $scope.loaded = false;

    var posOptions = { timeout: 5000, enableHighAccuracy: true, maximumAge: 5000 };
    $cordovaGeolocation.getCurrentPosition(posOptions)
        .then(function (location) {
            $scope.currentLat = location.coords.latitude;
            $scope.currentLong = location.coords.longitude;
            $scope.loaded = true;
        });

    $ionicPlatform.ready(function() {
        var bgGeo = $cordovaBackgroundGeolocation;

        // BackgroundGeoLocation is highly configurable.
        bgGeo.configure({
            url: 'http://www.my_api_url_here/',
            params: {
                deviceId: "testApp",
                "location": {
                    "latitude": "38.896339999999995",
                    "longitude": "-77.08521460000001"
                }
            },
            desiredAccuracy: 10,
            stationaryRadius: 20,
            distanceFilter: 30,
            notificationTitle: 'TestTitle', // <-- android only, customize the title of the notification
            notificationText: 'TestText', // <-- android only, customize the text of the notification
            activityType: 'OtherNavigation',
            debug: true, // <-- enable this hear sounds for background-geolocation life-cycle.
            stopOnTerminate: false // <-- enable this to clear background location settings when the app terminates
        });

        bgGeo.start();
    });
}])

Директива:

.directive('bgeo', ['$cordovaGeolocation', '$cordovaBackgroundGeolocation', '$http', 
           function ($cordovaGeolocation, $cordovaBackgroundGeolocation, $http) {
    return {
        scope: {
           lat: '=',
           lng: '='
       },
        link: function (scope) {
            console.log("directive: ", scope.lat, scope.lng);
                myLatLng = new google.maps.LatLng(scope.lat, scope.lng);
                mapOptions = {
                    zoom: 16,
                    center: myLatLng
                };
                map = new google.maps.Map(document.getElementById('map'), mapOptions);
                marker = new google.maps.Marker({
                    position: myLatLng,
                    map: map,
                    draggable: false,
                    icon: 'small-orange-pin.png'
                });
        }
    }
}])

Шаблон:

<ion-scroll zooming="true" direction="xy" style="width:90%">
   <div ng-if="loaded" bgeo lat="currentLat" lng="currentLong">
       <div id="map" style="width: 600px; height: 500px;"></div>
   </div>
</ion-scroll>

Метод запуска app.js:

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
    // for form inputs)
    if(window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }
    if(window.StatusBar) {
      StatusBar.styleDefault();
    }

    if (window.cordova) {
      if (window.plugins && window.plugins.backgroundGeoLocation) {
        BackgroundGeolocation.configurePlugin(window.plugins.backgroundGeoLocation);
      }
    }
  });
})

Полный исходный код находится на github по адресу https://github.com/sahiltalwar88/binding-geolocation-issue. Любая помощь высоко ценится!

Теги:
ionic-framework
cordova-plugins
ionic

1 ответ

1
Лучший ответ

Основная проблема заключалась в том, что мне пришлось запускать установку bower; Мне не хватало нескольких пакетов. Как только я это сделал, я мог бы использовать функцию ионной готовности и onDeviceReady просто отлично. Затем, чтобы работать с функциями обратного вызова iOS, мне пришлось обновить синтаксис для работы с ngCordova (который использует Q и обещания), а не функции обратного вызова, как показали примеры.

Вот структура моего последнего кода:

$ionicPlatform.ready(function() {
if(window.StatusBar) {
  StatusBar.styleDefault();
}

$location.path('/app');
$rootScope.$digest();

$rootScope.deviceReady = false; 

document.addEventListener('deviceready', function () {
    if(window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) {
      window.cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }

    var bgGeo = $cordovaBackgroundGeolocation;
    var deviceId = $cordovaDevice.getUUID();
    var addVisitUrl = 'your-url-goes-here';

    $rootScope.deviceId = deviceId;
    $rootScope.deviceReady = true;

    var posOptions = { timeout: 5000, enableHighAccuracy: true, maximumAge: 5000 };
    $cordovaGeolocation.getCurrentPosition(posOptions)
        .then(function (location) {
            $rootScope.currentLat = location.coords.latitude;
            $rootScope.currentLong = location.coords.longitude;

            var yourAjaxCallback = function(response) {
                bgGeo.finish();
            };

            var callbackFn = function(location) {
                var data = {
                                deviceId: deviceId,
                                "location": {
                                    "latitude": location.latitude,
                                    "longitude": location.longitude
                                }
                            };
                $http.post(addVisitUrl, data);
                // Other code goes here

                yourAjaxCallback.call(this);
            };

            var failureFn = function(error) {
                alert('Background Geolocation Error: ' + error);
                // Other code goes here
            };

            bgGeo.configure({
                url: addVisitUrl,
                params: {
                    deviceId: deviceId,
                    "location": {
                        "latitude": $rootScope.currentLat,
                        "longitude": $rootScope.currentLong
                    }
                },
                desiredAccuracy: 10,
                stationaryRadius: 10,
                distanceFilter: 10,
                activityType: 'OtherNavigation',
                debug: true, 
                stopOnTerminate: false
            })
            .then(callbackFn, failureFn, callbackFn);

            bgGeo.start();
        });
    $rootScope.$digest();
    });
  });
})

Ещё вопросы

Сообщество Overcoder
Наверх
Меню