1

我对 Meteor 完全陌生，我正在做排行榜示例。我的代码有一点问题。

我试图添加一个切换按钮来切换排序。切换和一切工​​作正常，但按钮的文本没有更新。

我的 JavaScript 代码：

if (Meteor.isClient) {
    Meteor.startup(function () {
        Session.set("sortMethod", "score");
    });

    ...

    Template.leaderboard.players = function () {
        if (Session.equals("sortMethod", "name"))
            return Players.find({}, {sort: {name: 1}});
        else if(Session.equals("sortMethod", "score"))
            return Players.find({}, {sort: {score: 1}});
    };

    ...

    Template.leaderboard.sortMethod = function () {
        return Session.get("sortMethod");
    }

    ...

    Template.leaderboard.events({
    'click input.sortToggle': function () {
      Session.equals("sortMethod", "name") ? Session.set("sortMethod", "score") : Session.set("sortMethod", "name");
    }
  });
}

我的车把模板：

<template name="leaderboard">
  <!-- this is where it goes wrong, the button text doesn't update at {{sortMethod}} -->
  <input type="button" class="sortToggle" value="sort by {{sortMethod}}">
  <!--  -->
  <div class="leaderboard">
    {{#each players}}
      {{> player}}
    {{/each}}
  </div>

  {{#if selected_name}}
  <div class="details">
    <div class="name">{{selected_name}}</div>
    <input type="button" class="inc" value="Give some points" />
  </div>
  {{else}}
  <div class="none">Click a player to select</div>
  {{/if}}
</template>

注意：我删除了一些不相关的代码。

4

2 回答 2

2

如果您改用按钮，它会起作用：

<button class="sortToggle">sort by {{sortMethod}}</button>

随着对事件的相应更改：

'click .sortToggle': function () { ...

更改输入的值过去曾被报告为问题，但已关闭。也许它需要重新打开。

于 2014-04-26T01:37:22.220 回答
1

我不确定这是错误还是功能。我认为问题源于尝试更新具有焦点的输入元素。所以解决方法是在事件处理程序的末尾模糊（）元素。像这样：

'click input.sortToggle': function ( event ) {
    Session.equals("sortMethod", "name") 
      ? Session.set("sortMethod", "score") 
      : Session.set("sortMethod", "name");
    $( event.currentTarget ).blur();
}
于 2014-04-26T07:18:50.100 回答