0

この場合、要素がセッションで選択されているかどうかに関係なく、特定の基準に一致する要素にのみ特定のイベントを追加したいと思います。コード例を次に示します。

Template.leaderboard.events({
    'click Session.get("selected_team") .win': function () {
        Teams.update(Session.get("selected_team"), {$inc: {won: 1, score : 5, played: 1}});
    }
});

これにより、セッションで選択されたチームが検索され、そのアイテムが更新されます。それは理にかなっていますか？私が望むものを達成するためのより良い方法はありますか?

4

2 に答える 2

0

リーダーボードの例では、選択されたプレーヤーに「選択済み」の css クラスが与えられるため、必要なことは次のとおりです。

Template.player.events({
  'click .selected': function () {
    console.log('clicked on the selected player:', this.name);
  }
});

条件付きでイベントをトリガーする可能性のある他の要素に同じパターンを使用できます。条件に応じて、特定の css クラスをそれらに割り当てます (または割り当てません)。

(何らかの理由で) テンプレートを介して要素に css クラスを追加したくない場合は、Javascript で条件を確認するだけのほうがよいでしょう。

Template.player.events({
  'click': function () {
    if (Session.get("selected_player") === this._id) {
      console.log('clicked on the selected player:', this.name);
    }
  }
});
于 2013-01-22T01:25:19.757 に答える
-1

文字列の一部としてSession.getステートメントを含めているため、記述した方法では機能しません。このようなものが機能する可能性があります：

Template.leaderboard.events({
  'click ' + Session.get("selected_team") + ' .win': function() {}
});

...しかし、私はそれをお勧めしません。代わりに、おそらく次のようなことを行う必要があります。

Template.leaderboard.events({
  'click .team': function() {
    Teams.update(this.id, {...});
  }
});

Template.leaderboard.teams = function() {
  return Teams.find({});
}

あなたの見解では：

<template name="leaderboard">
  {{#each teams}}
    <div class="team">{{team}}</div>
  {{/each}}
</template>

それぞれが、イベントハンドラー内.teamと呼ばれるリーダーボードテンプレート内のコンテキストを引き続き記憶しているため、クエリthisに渡すだけで済みます。this.id

于 2013-01-21T23:17:38.323 に答える