Javascript 通过服务更新控制器而不更新视图
在我的应用程序中,我有一个“地图”来显示和处理地图上的东西。Javascript 通过服务更新控制器而不更新视图,javascript,angularjs,google-maps-api-3,angularjs-service,angularjs-controller,Javascript,Angularjs,Google Maps Api 3,Angularjs Service,Angularjs Controller,在我的应用程序中,我有一个“地图”来显示和处理地图上的东西。CtrlMap控制器显示地图并显示标记。watchPosMap监视位置变化。第三,有一个名为markerService的服务,它保存标记的属性(位置) 结构是这样的 [CtrlMap][MarkerService]如果您在适当的范围内,那么您必须在修改外部内容时更新范围 angular.element(document.getElementById('id_map')).scope().$apply(); 评论后编辑: 虽然在服务中设
CtrlMap
控制器显示地图并显示标记。watchPosMap
监视位置变化。第三,有一个名为markerService
的服务,它保存标记的属性(位置)
结构是这样的
[CtrlMap][MarkerService]如果您在适当的范围内,那么您必须在修改外部内容时更新范围
angular.element(document.getElementById('id_map')).scope().$apply();
评论后编辑:
虽然在服务中设置了范围标记,但它未在事件中更新。在使用$apply()之前,必须对其进行更新
编辑2:更干净的方式
$apply of scope有一个回调函数,您可以使用它来实现相同的功能
navigator.geolocation
.watchPosition(function(data) {
mapscope = angular.element(document.getElementById('id_map')).scope()
mapscope.$apply(function(scope){
MarkerService.setP(data.coords.latitude,data.coords.longitude);
scope.marker = MarkerService.getP();
});
},
function(e){$scope.errorMsg=e;},
{ timeout: 30000 }
);
我仍然使用$apply()。我编辑我的问题:请查看watchPosMap
控制器。服务属性已更新,但恐怕标记未更新。您需要更新mapScope.marker=angular.element(document.getElementById('id_-map')).injector().get(“MarkerService”).getP();在使用$apply()之前是的!就这样!:-)我想知道,我的解决方案是否是结合angularjs和legacy JS的正确方法@BNDR更新了我的答案,请验证。我希望,angular.element(document.getElementById('id_-map'))。scope()与watchPosMap控制器的作用域相同
它是不同的控制器,但应用程序/模块相同。我不确定:这是相同的范围吗?我不这么认为,对吧?
angular.element(document.getElementById('id_map')).scope().$apply();
mapScope.marker = angular.element(document.getElementById('id_map'))
.injector().get("MarkerService")
.getP();
navigator.geolocation
.watchPosition(function(data) {
mapscope = angular.element(document.getElementById('id_map')).scope()
mapscope.$apply(function(scope){
MarkerService.setP(data.coords.latitude,data.coords.longitude);
scope.marker = MarkerService.getP();
});
},
function(e){$scope.errorMsg=e;},
{ timeout: 30000 }
);