Question

我正在使用Meteor 0.5.4我刚遇到Meteor的Session.set（）时出现了一个奇怪的问题。

我想在用户点击模板实例时显示一个简单的模态对话框。

当用户点击模板实例时，我正在使用Template的事件映射将一些信息设置为Session。

Template.Orders.events({
'click' : function () {
    Session.set("OrderName", this.name);
}
});

模态对话模板然后在会话中显示数据集：

Template.OrderDialogue.OrderName = function() {
    return Session.get("OrderName");
}

最后这是我的JQuery代码

Template.Orders.rendered = function() {
    jQuery('a[rel*=leanModal]').leanModal();
}

当我使用Session.set（）时 - 如上面在Template.orders的click事件处理程序中所示 - JQuery插件在第一次单击模板实例时不显示模态对话框，但仅在第二次单击该确切实例时显示。只需点击两次模板实例即可获得模态对话。

当我删除Session.set（）时，一切正常 - 首次点击时会显示模态对话，因为它应该有效。

调试输出显示第一次单击时正确设置了会话值。

Session.set（）如何干扰我的JQuery插件？

Answer 1

leanModal在Meteor引擎将新内容反应性地输入其中之前显示OrderDialogue的HTML内容，因此关键是将leanModal点击包裹在setTimeout中确保反应已经发生。

假设你有：

<template name="OrderDialogue">
    <div id="overlay_content">
       <h1>{{OrderName}}</h1>
    </div>
</template>

<template name="Orders">
    {{#each order}}
        <a href="#overlay_content" rel="leanModal">{{name}}</a>
    {{/each}}
</template>

你的javascript：

Template.Orders.events({
   'click' : function () {
      Session.set("OrderName", this.name);
   }
});

Template.OrderDialogue.OrderName = function() {
   return Session.get("OrderName");
}

Template.Orders.rendered = function() {
   $("a[rel*=leanModal]").leanModal();
}

然后你必须在click事件处理程序上使用setTimeout破解leanmodal小部件，以便在事件冒泡之前给出反应性片刻以呈现OrderName内容。

假设this is the script，请在此脚本中包含点击处理程序（从第23行开始），如下所示：

$(this).click(function(e) {
    setTimeout(function() {
        var modal_id = $(this).attr("href");
        ...
    }, 1);
});

Meteor的Session.set导致JQuery代码出现问题？

1 个答案: