尝试绑定多个Meteor模板事件时出错

时间:2018-03-25 02:52:52

标签: javascript html meteor web

我有以下两个模板,我试图将函数绑定到。正如您所看到的,它是一个简单的应用程序,可以将具有名称和分数的对象添加到其mongoDB中。

这是HTML文件:

<head>
  <title>Leaderboard</title>
</head>
<body>
  <h1>Leaderboard</h1>
  {{> leaderboard}}
  <br /><br />
  {{>addPlayerForm}}
</body>

<template name="leaderboard">
  <ul>
    {{#each player}}
    <li class="player {{selectedClass}}"> {{name}} : {{score}} </li>
    {{/each}}
  </ul>
  <ul>
    {{#if showSelectedPlayer}}
    <li> Selected Player: {{showSelectedPlayer.name}} </li>
    {{/if}}
  </ul>
  <input type="button" class="increment" value="Give 5 Points"/>
  <input type="button" class  ="decrement" value="Minus 5 Points"/>
</template>
<template name="addPlayerForm">

  <form class="add-form">
    <input type="text" name="PlayerName" placeholder="Add player name here" />
    <input type="submit" name="Add Player" />
  </form>
</template>

完整的JS文件:

PlayersList = new Mongo.Collection('Players');
console.log(PlayersList);

if(Meteor.isClient){
  Template.leaderboard.helpers({
    'player': function(){
        return PlayersList.find( )
    },
    'selectedClass':function(){
      var playerId=this._id;
      var selectedPlayer=Session.get('selectedPlayer');
      if (playerId==selectedPlayer){
        return "selected"
      }
    },
    'showSelectedPlayer':function(){
      var selectedPlayer = Session.get('selectedPlayer');
      return PlayersList.findOne(selectedPlayer)
      }
  });
  Template.leaderboard.events({
    'click .player':function(){
      var playerID = this._id; //this refer to the current context:playerclicked
      Session.set('selectedPlayer', playerID);
      var selectedPlayer = Session.get('selectedPlayer');
      console.log(selectedPlayer);
    },
    'click .increment':function(){
    var selectedPlayer = Session.get('selectedPlayer');
    PlayersList.update(selectedPlayer,{$inc:{score:5}});
    },
    'click .decrement':function(){
    var selectedPlayer = Session.get('selectedPlayer');
    PlayersList.update(selectedPlayer,{$inc:{score:-5}});
    }
  });
  Template.addPlayerForm.events({
    'submit form': fucntion(event){
      event.preventDefault();
      var PlayerNameVar = event.target.PlayerName.value;
      console.log(PlayerNameVar);
      PlayersList.insert({
        name:PlayerNameVar,
        score:0
      });
    }
  });
}
if(Meteor.isServer){
  console.log("Hello Server!");
}

这是错误:

  

使用ecmascript处理文件时(对于目标web.browser):      main.js:38:34:意外的令牌,预期&#34;,&#34; (38:34)

     

使用ecmascript处理文件时(对于目标os.windows.x86_32):      main.js:38:34:意外的令牌,预期&#34;,&#34; (38:34)

第38行在Template.addPlayerForm.events中:

'submit form': fucntion(event){

1 个答案:

答案 0 :(得分:1)

Ankit发现,你需要纠正错字。它是function,我建议您使用 Sublime Atom VS CODE 等编辑器来摆脱这种拼写错误。< / p>