0

我使用 html5 geolocation api 创建了这个片段。如果用户允许并显示 lat,lng{{lat}}

我不明白为什么 lat 只在第二次点击时显示。我以为 showPosition() 已经触发了？您可以在第一次单击时看到它显示在控制台中。

HTML：

<body ng-controller="MainCtrl">
{{lat}}
  <button ng-click="getLocation()">Click</button>
</body>

JS：

app.controller('MainCtrl', function($scope) {
  $scope.getLocation = function() {
    if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(showPosition);
    } else {
      alert("Geolocation is not supported by this browser.");
    }
  }
  function showPosition(position) {
    $scope.lat = "Latitude: " + position.coords.latitude;
    $scope.lng = "Longitude: " + position.coords.longitude; 
    console.log($scope.lat);
  }
});
4

1 回答 1

2

回调函数showPosition被称为“外部”Angular，因此尽管您的$scope属性会更新，但视图不会更新，因为 Angular 不知道这些更改。

$scope.$apply()在函数底部调用showPosition()。这将导致一个摘要循环运行，Angular 会注意到您对 $scope 所做的更改（因为 Angular 在您的 HTML 中使用 {{}} 设置了 $watches）并更新视图。

于 2013-04-12T03:47:11.523 回答