在AngularJS脚本中使用$ scope变量

我正在使用AngularJS，Ionic Framework和Cordova。我试图将当前用户位置设置在地图的中心。

这里是我的代码：

.controller('mainCtrl', function($scope) { 
    $scope.position = ""; 
    var latLng = {}; 
    if (navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(function(position) { 
     $scope.$apply(function() { 
      $scope.position = position; 
      latLng = { 
      'lat': position.coords.latitude, 
      'lng': position.coords.longitude 
      }; 
     }); 
     }); 
    }; 
    $scope.map = { 
     center: { 
     latitude: 51.219053, 
     longitude: 4.404418 
     }, 
     ...

我可以打印当前用户位置这样的脚本之外：

clat: {{position.coords.latitude}}, clang: {{position.coords.longitude}}

但我想用它在脚本中。我已经尝试过这些没有任何成功：

center: { latitude: position.coords.latitude,... 
center: { latitude: $scope.position.coords.latitude,... 
center: { latitude: latLng.lng,... 
center: { latitude: latLng['lng'],...

如何在脚本中使用它？

错误日志：

TypeError: Cannot read property 'latitude' of undefined

来源

2016-01-12 partiz

检查你安慰错误 –

这是因为地理位置是异步 – maurycy

函数调用发生在控制器中时，是否需要'$ apply'？ – tylerwal

如果你想获得COORDS后初始化谷歌地图，你可以用承诺做到nicelly

working plunker

var app = angular.module('plunker', []); 

app.controller('MainCtrl', function($scope, $q) { 
    var deferredBrowserLocation = $q.defer() 

    getBrowserLocation = function() { 
    navigator.geolocation.getCurrentPosition(function(position) { 
     console.log(position.coords) 
     deferredBrowserLocation.resolve(position) 

    }) 
    return deferredBrowserLocation.promise 
    } 

    getBrowserLocation().then(function(position) { 
    $scope.map = { 
     center: { 
     latitude: position.coords.latitude, 
     longitude: position.coords.longitude 
     } 
    } 
    }).finally(function(){ 
    //initialize googlemaps with $scope.map 
    }) 
});

来源

2016-01-12 14:07:06 maurycy

我敢肯定，这是因为你正在努力已设置之前访问COORDS，出现这种情况是异步的。

它可能在代码中的其他地方工作，只是因为在代码运行之前有一段延迟，这足以让坐标被设置。这被称为竞赛条件。

您可以在回调函数中设置coords的值，如下所示。

if (navigator.geolocation) { 
    navigator.geolocation.getCurrentPosition(function(position){ 

    //Check coords is not undefined and then build the center object 
}

}

来源

2016-01-12 14:06:39 daniellepelley

在AngularJS脚本中使用$ scope变量

回答

相关问题