javascript - 如何将 Angular 与 HTML5 地理定位原生 API 结合使用?

标签 javascript angularjs html angular-ui

我使用以下代码片段来获取当前地理位置:

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 };
        });
  });
});

我面临的问题是我必须调用 Controller 两次才能渲染 map 。使用 navigator 时会发生这种情况,因此这不是纯粹的 Angular UI 问题。

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

最佳答案

navigator.geolocation 位于 Angular 核心之外,因此在其中进行的任何范围更改都需要通知 Angular 运行摘要以更新 View 。有几种方法可以做到这一点。

尝试:

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

关于javascript - 如何将 Angular 与 HTML5 地理定位原生 API 结合使用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33002785/

相关文章:

javascript - 在 onerror 属性中使用闭包似乎不起作用

javascript - 在 ASPX 中调用 javascript 的 ASCX 结果

angularjs - 如何创建响应式(可变列数)Angular-Material 卡片网格

javascript - 如何使用 angularjs 指令动态添加表单验证属性?

javascript - 如何使用 HTML 中的 if 语句将图像添加到表格中?

javascript - 在 IE8 及以下版本中的 HTML5 元素 CSS & Javascript 交互

Javascript:存储 map 数据的最佳方式?

javascript - 检查匹配的键是否相等

javascript - 滚动时 WebKit 中的粘性导航和轮播滞后

javascript - 滚动时固定边栏的计算