JQuery回调中没有更新流星模板

Meteor template not updating in JQuery callback

本文关键字：流星 更新 回调 JQuery      更新时间：2023-09-26

我试图让一个div淡出，然后改变正在模板中使用的会话变量。会话变量在回调函数中被成功更改，但模板没有响应性更新。

下面的不会反应性地更新模板。(这些都是触发器)

$(event.target.parentNode).find(subclass)
                          .fadeOut("slow", function() {
    Session.set(this.valueOf() + "_show_exercise_fields", set_show_exercise_fields);

下面的使反应性地更新模板。

Session.set(this.valueOf() + "_show_exercise_fields", set_show_exercise_fields);
$(event.target.parentNode).find(subclass)
                          .fadeOut("slow", function() {
    // do nothing
});

是否有一种方法可以强制模板重新渲染或更好的方法来做我想做的事情。由于

<标题>编辑1

下面是整个函数

Template.exercise.events({
'click .exercise-name': function(event) {
    var subclass                 = ".exercise-fields-container";
    var set_show_exercise_fields = false;
    if (!Session.get(this.valueOf() + "_show_exercise_fields")) {
        var subclass                 = ".exercise-options-container";
        var set_show_exercise_fields = true;
    }
    // find the subclass (either the fields container or the options
    // container) and fade out
    $(event.target.parentNode).find(subclass)
                              .fadeOut("slow", function() {
        Session.set(this.valueOf() + "_show_exercise_fields", set_show_exercise_fields);
    });
}
});
Template.exercise.helpers({
    show_fields: function() {
        Session.setDefault(this.valueOf() + "_show_exercise_fields", true);
        return Session.get(this.valueOf() + "_show_exercise_fields");
    }
});

下面是模板

<template name="exercise">
    <div class="exercise-name">
        {{this.name}}
    </div>
    {{#if show_fields}}
        Fields
    {{else}}
        Options
    {{/if}}
</template>

事件处理程序不是响应式上下文。你可以使用Tracker.autorun()创建一个响应式上下文。

如果在传递给autorun的函数中使用会话变量，则无论何时更改会话变量，整个函数都将重新运行。在这种情况下，你可以根据自己的意愿淡入或淡出。

我有一个场景，其中一个集合正在更新，所以我不得不重新构建我的选择元素使用Materialize select

这是我的渲染函数的样子。autorun知道Channels是一个响应性数据源，并在该数据源发生变化时重新运行autorun函数。

Channels = new Mongo.Collection("channels");
Template.channelSelectController.onRendered(function(){
    var self = this;
    this.autorun(function(){
        var count = Channels.find().count();
        self.$('select').material_select();
    });
});
相关文章：