如何将 Angular 与 HTML5 地理定位本机 API 一起使用？

Question

我正在使用以下代码片段获取当前地理位置：

angular.module('HomelandApp').controller('PlacesController', function($scope,$http, $localStorage, uiGmapGoogleMapApi) {

  uiGmapGoogleMapApi.then(function(maps) {

        navigator.geolocation.getCurrentPosition(function (pos) {
            $scope.map = { center: { latitude: pos.coords.latitude, longitude: pos.coords.longitude }, zoom: 17 };
        });
  });
});

我面临的问题是我不得不 调用控制器两次 才能渲染地图。使用 navigator 时会发生这种情况，因此它不是纯粹的 Angular UI 问题。

我猜他们是针对原生 JS 细节的摘要循环 Angular。我该如何解决这个问题？

Answer 1

navigator.geolocation 在 angular 核心之外，因此在核心范围内所做的任何范围更改都需要通知 angular 到运行更新视图的摘要。有几种方法可以做到这一点。

尝试：

 navigator.geolocation.getCurrentPosition(function (pos) {
            $scope.map = { .... };
            $scope.$apply();
});

如何将 Angular 与 HTML5 地理定位本机 API 一起使用？

How to use Angular with HTML5 geolocation native API?

html

javascript

angularjs

angular-ui