我是一个 meteor.js nuub,但我确实花了很多时间来弄清楚这个问题。
我正在尝试根据传递到 getCurrentPosition 的 HTML5 地理定位 API 回调来响应式更新我的 UI。但是,UI 未使用我当前的代码进行更新。
您能提供建议和/或解决方案吗?以下是详细信息:
基础知识: meteor 服务器正在运行,通过集合成功地向/从 mongo 提供其他数据
我有一个主页 (main.html):
<head>
<title>Geolocation</title>
</head>
<body>
<div class="container">
<header class="navbar">
<div class="navbar-inner">
<a class="brand" href="/">Geolocation</a>
</div>
</header>
<div id="locationDemo">
{{> location}}
</div>
</div>
</body>
引用模板 (location.js):
<template name="location">
<div>
Lat: {{lat}}
</div>
<div>
Lon: {{lon}}
</div>
</template>
有这个关联的助手(location.js):
_lat = {
current: 0,
dep: new Deps.Dependency,
get: function(){
this.dep.depend();
if(this.current === 0){
getLocation();
}
return this.current;
},
set: function(value){
this.current = value;
this.dep.changed();
Deps.flush();
return this.current;
}
};
_lon = {
current: 0,
dep: new Deps.Dependency,
get: function(){
this.dep.depend();
if(this.current === 0){
getLocation();
}
return this.current;
},
set: function(value){
this.current = value;
this.dep.changed();
Deps.flush();
return this.current;
}
};
function getLocation(){
if (navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(showPosition, showError);
}
else{
console.log("Geolocation is not supported by this browser.");
}
}
function showPosition(position)
{
_lat.set(position.coords.latitude);
_lon.set(position.coords.longitude);
}
function showError(error) {
switch(error.code) {
case error.PERMISSION_DENIED:
console.log("User denied the request for Geolocation.");
break;
case error.POSITION_UNAVAILABLE:
console.log("Location information is unavailable.");
break;
case error.TIMEOUT:
console.log("The request to get user location timed out.");
break;
case error.UNKNOWN_ERROR:
console.log("An unknown error occurred.");
break;
}
}
Template.location.helpers({
lat: _lat.get(),
lon: _lon.get()
});
最佳答案
据我所知,navigator.geolocation
不是响应式(Reactive)数据源。因此,如果没有一些明确的轮询,这将无法工作。另一件你弄错的事情是你的助手不是函数,所以它们不能被重复调用。
这可能有效(未测试):
Meteor.setInterval(function() {
navigator.geolocation.getCurrentPosition(function(position) {
Session.set('lat', position.coords.latitude);
Session.set('lon', position.coords.longitude);
});
}, 5000);
Template.location.helpers({
lat: function() { return Session.get('lat'); },
lon: function() { return Session.get('lon'); }
});
关于javascript - Meteor.js 响应式 html5 地理定位 position.coords,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24835925/