4

我对 Meteor 很陌生,但到目前为止,我真的很喜欢在这个平台上编码。我遇到了一些障碍,似乎找不到正确的方法。我想创建一个辅助函数来检查纬度和经度,并根据某个预定义的范围检查它,如果它介于两者之间,则返回 true。

我已经包含了我目前拥有的代码:

Template.header.helpers({
 locationCheck: function() {
    navigator.geolocation.getCurrentPosition(success_callback,error_callback);

    function success_callback(p){
        // Building Latitude = 51.522206
        // Building Longitude = -0.078305
        var lat = parseFloat(p.coords.latitude);
        var lon = parseFloat(p.coords.longitude);
        console.log('Latitude: '+lat);
        console.log('Longitiude: '+lon);

      if( lat >= 51.521606 && lat <= 51.522606 && lon >= -0.078805  && lon <=  -0.077705 ) {
        console.log('you are in the area');
        return 1;
      } else {
        console.log('you are not in the area');
        return 0;
      }
    }

    function error_callback(p){
         return 0;
    }
 }
});

在我的模板中,我想在句柄 if 语句中使用返回值,如下所示:

  {{#if locationCheck}}
        {{loginButtons}}
  {{else}}
        <p>Your are out of the vicinity</p>
  {{/if}}

问题是它始终返回 else 语句结果,即使在控制台中它正在返回 this you are in the area

任何帮助都是极好的。

提前致谢。

4

1 回答 1

3

这是因为回调模式。到回调返回数据时,帮助程序已经返回 undefined。您需要在助手中使用同步 javascript,如果有异步操作,请使用反应式MeteorSession 哈希通过以下方式中继数据:

Template.header.helpers({
    locationCheck: function() {
        return Session.get("locationCheck");
    },
    isLoading:function() {
        return Session.equals("locationCheck",null); 
    }
});

然后在创建模板时的标题中,您可以触发检查:

Template.header.created = function() {
    navigator.geolocation.getCurrentPosition(success_callback,error_callback);

    function success_callback(p){
        // Building Latitude = 51.522206
        // Building Longitude = -0.078305
        var lat = parseFloat(p.coords.latitude);
        var lon = parseFloat(p.coords.longitude);
        console.log('Latitude: '+lat);
        console.log('Longitiude: '+lon);

      if( lat >= 51.521606 && lat <= 51.522606 && lon >= -0.078805  && lon <=  -0.077705 ) {
        console.log('you are in the area');
        Session.set("locationCheck",1);
      } else {
        console.log('you are not in the area');
        Session.set("locationCheck",0);
      }
    }

    function error_callback(p){
         return 0;
    }
}

一旦设置Session.set("locationCheck",1)(或0),模板将使用新数据重新渲染。

您可以isLoading在捕获位置时使用帮助程序:

<template name="header">
    {{#if isLoading}}
    Loading
    {{else}}
        {{#if locationCheck}}
            {{>template1}}
        {{else}}
            {{>template0}}
        {{/if}}
    {{/if}}
</template>

<template name="template0">
    <p>Denied</p>
</template>

<template name="template1">
    Approved
</template>
于 2013-05-14T10:12:08.000 回答