Javascript 使用会话变量和订阅/发布更新模板仅使用以前的查询进行更新并附加信息 工作原理

我为视频集合（相当于视频信息列表）和Specs集合（与视频集合直接相关的信息列表）设置了一个下标/出版物

简单地说，一个视频属于一个规范（又名：专门化），一个规范可以有多个视频

因此，我有一个选择与规格列表。在

change

上，我想加载集合中与该规范对应的所有视频

我的技巧是简单地调用Meteor.subscribe（“videos pub sub”，$（evt.target.val（））当检测到on更改时。使用正确的信息更新集合后，我将使用会话变量更新模板

然后，发布的服务器端：

    Meteor.publish("videos-pub-sub", function (spec){
        console.log("Publishing videos...");
        var res = [];
        if(spec && spec > 0){
            console.log("Spec not empty: " + spec)
            res = Videos.find({spec: parseInt(spec)});
        }else{
            console.log("Spec not set...")
        }
        console.log("publication " + res.fetch().length);
        return res;
    });

问题和问题的描述

当我选择一个选项时，不会添加包含视频信息的表，即使在my console.log中正确检索了该信息。但是，当我进行第二次选择时，表中就充满了上一次的查询。为什么?

当我进行第三次select更改时，前面的查询数据会附加到表中。它不应该被替换吗？还是我必须手动清空表格

相关HTML:

<select id="categories">
  <option></option>
  {{#each specs}}
  <option value="{{id}}">{{name}}</option>
  {{/each}}
</select>


<table id="video_table" class="table table-striped table-hover">
  <thead>
    <tr>
      <th>ID</th>
      <th>Name</th>
      <th>Authors</th>
      <th>Date Published</th>
      <th>Abstract</th>
      <th>Category</th>
      <th>Private</th>
      <th>Online</th>
      <th>Upload</th>
    </tr>
  </thead>
  <tbody id="video_tbody">
    {{#each videos}}
    <tr>
      <td>{{id}}</td>
      <td>{{title}}</td>
      <td>{{authors}}</td>
      <td>{{date_published}}</td>
      <td>{{description}}</td>
      <td class="category" data-id="{{spec}}">
        {{specName}}
      </td>
      <td>
        <input type="checkbox" aria-label="..." checked="{{#if private}}checked{{/if}}">
      </td>
      <td>{{#if online}}<span class="label label-success">Online</span>{{else}}<span class="label label-default">Offline</span>{{/if}}</td>
      <td>
        <input type="checkbox" checked="checked">
      </td>
    </tr>
    {{/each}}
  </tbody>
</table>

  Template.List.events({
    'change #categories':function(evt){

      Meteor.subscribe("videos-pub-sub", $(evt.target).val());

      console.log('Change #categories detected');
      var vids = Videos.find({}).fetch();
      console.log(vids);

      Session.set("videos-session", Videos.find({}).fetch());
      console.log(Session.get("videos-session"));

    }
  });

如果需要更多的JS，我可以提供更多

---

我对Meteor还比较陌生，我仍在尝试了解它是如何工作的。如果您看到我可以改进的地方，请告诉我。

我在我的项目中看到，当订阅/调用meteor上的某个内容时，有时它会在没有收到previews server应答的情况下运行下一行代码，并且会带来一些类似您的问题。因此，我通常在subscribe/call函数中嵌套应该做的事情，然后它只在返回数据后运行

我会这样做：

Template.List.events({
    'change #categories':function(evt){

         Meteor.subscribe("videos-pub-sub", $(evt.target).val(), function(){
               //to empty the table
               $('#video_table').find('tbody').empty();
               var vids = Videos.find({}).fetch();
               Session.set("videos-session", Videos.find({}).fetch());
         });

     }
});

---

让我知道它是否有效

问题的一部分在于，您正在订阅事件处理程序，因此每次运行时都可能创建一个新订阅（而不是替换旧订阅）。将订阅移动到Template.onCreated（使用Template.subscribe调用创建）。作为参数，将在事件处理程序中设置的ReacriveVar传递给它。将订阅包装在template.autorum中，以便在调用ReactiveVar时重新运行changed@bluebird谢谢你的建议。我会试试看，然后告诉你。这其实是个不错的主意。我明天试试。谢谢，工作很顺利。非常感谢。然而，这些视频仍然会被追加。我必须手动清空表格吗？编辑：我只是继续手动清空它。