Phonegap地理位置无法在移动设备上运行

时间:2015-03-30 13:53:30

标签: javascript angularjs cordova mobile geolocation

我尝试使用Phonegap(3.7.0)和使用地理位置的AngularJS制作(混合)webapp。我的问题是地理定位在浏览器中工作,但是当我在Phonegap中构建项目并尝试在移动设备上运行它时。当我在Javascript中删除AngularJS控制器时,geolocator就像移动设备上的魅力一样。我尝试手动引导AngularJS(对于DOM加载顺序),但这对我没有用。配置文件至少我认为是正确的。

有人可以帮我解决这个问题或给我提供线索吗?

提前致谢

HTML          

    <meta charset="utf-8" />
    <meta name="viewport" content="initial-scale = 1.0">

    <!-- Phonegap Javascript -->
    <script src="js/cordova/cordova.js" type="text/javascript"></script>

    <!-- AngularJS Javascript -->
    <script src="js/angular/angular.js" type="text/javascript"></script>
    <script src="js/angular/angular-route.js" type="text/javascript"></script>

    <!-- Foundation for apps Javascript -->
    <script src="js/vendor/modernizr.js"></script>

</head>

<body>  
      <div class="content-container" ng-app="mamyloeApp">
           <div ng-controller="UitjesDichtbijController" class="list-view-uitje">                        
               <ul ng-repeat="uitjes in uitjes.uitjes" class="list-item-uitje">
                   <li><a href='#'>
                        <div class="list-item-uitje-left">
                             <div class='uitje_list_image'>
                                   <img src="../library/photos/{{uitjes.list_image}}" alt='image'>
                                        </div>
                                    </div>
                                    <div class="list-item-uitje-right">
                                        <div class="naam-uitje">{{uitjes.overview}}</div>
                                        <div class="uitje-info">
                                            <div class="plaats-uitje">{{uitjes.city}}({{uitjes.distance | number:1}}km)</div>
                                            <div class="categorie-uitje">{{uitjes.category}}</div>
                                        </div>
                                        <div class="naam-local">{{uitjes.firstname}}</div>
                                    </div>

                                </a></li>
                        </ul>

                    </div> 
    <script src="js/vendor/jquery.js"></script>
    <script src="js/foundation.min.js"></script>
    <script src="js/foundation/foundation.offcanvas.js"></script>

            <!-- Controller scripts -->
    <script src="js/load_list.js" type="text/javascript"></script>

</body>

Geolocator / AngularJS

var latitude = 0;
var longitude = 0;


var geo_initiate = false;

var App = angular.module('mamyloeApp', []);

App.controller('UitjesDichtbijController', function ($scope, $http) {

    function geolocation()
    {
        var options = {enableHighAccuracy: true, timeout: 20000, maximumAge: 18000000};
        watchID = navigator.geolocation.getCurrentPosition(onSuccess, onError, options);

        function onSuccess(position)
        {
            latitude = position.coords.latitude;
            longitude = position.coords.longitude;

            console.log("GPS is ready");
            console.log(latitude);
            console.log(longitude);

            $http.get("http://../Mamyloe_app/api/uitjes/" + latitude + "&" + longitude + "")
                    .success(function (response) {
                        $scope.uitjes = response;
                        console.log(response);
                    });

            geo_initiate = true;   

            if(geo_initiate === true){
                document.getElementById("content-container").style.visibility = "visible";
            }
        }
        function onError(error)
        {
            if (error.code = 1)
            {
                alert("Enable your GPS!");
            }
            console.log("GPS is NOT ready");
        }
    }
    $(document).ready(function () {
        geolocation();
    });
});

1 个答案:

答案 0 :(得分:0)

问题解决了,访问源是配置文件中的问题(访问origin =“*”)和地图结构中的一些大写字母,phonegap不喜欢这样。