Question

看看我是否可以在模板中插入帮助器。好像我做错了，因为你实际上无法点击我程序中的按钮。

HTML：

<head>
  <title>BubblePopper</title>
</head>

<body>
  {{loginButtons}}
  {{>home}}
</body>
<template name ="grid">

  <div id="container">
    {{#each buttons}}
      <button class="button" type="button"></button>
    {{/each}}
  </div>
 </template>

<template name = "home">
  <h1> Welcome to bubblePopper</h1>
  <p> Current Game Status:
    //this is the part I'm confused about is it ok to insert the grid helper into this
    //if statement in the template?
    {{#if game.active}}
      Game in progress. <a href="#" id="finishGame">Finish Game</a><br>
      <center>{{>grid}}</center>
    {{else}}
      {{#if game.finished}}
        Game done or another player left.<a href="#" id="newGame">Start a new game</a>
    {{else}}
      Waiting for a new player to login. Find a <a href="#" id="newGame">new game</a>
    {{/if}}
  {{/if}}
</p>
<p><strong> Current Game ID: </strong>{{game._id}}</p>
  <p><strong> Current Game Player Count: </strong>{{game.players.length}}</p>

  <p><strong> Current Game Active: </strong>{{game.active}}</p>


</template>

Client.JS：

if (Meteor.isClient) {
  Deps.autorun(function(){
    gameSubscription = Meteor.subscribe("myGames",Meteor.userId());
  });
  Template.home.game = function(){
    return gameCollection.findOne({current: true});
  };
  Template.home.events({
    "click #newGame" : function() {
      Meteor.call('newGame')
    },
    "click #finishGame": function(){
      var game = gameCollection.findOne({current: true});
      Meteor.call('finishGame', game._id);
    }
  });

  //was confused if I should just include buttons as a part of homes template
  Template.grid.buttons = function (){
    var list = [];
    for(var i=1; i<=64; i++){
      list.push({value: i});
    }
    return list;
    }

  Template.button.events({
    'click .button': function(ev) {
      $(ev.target).css('visibility', 'hidden');
      console.log("pop")
   }
});



}

我没有包含server.js，因为它与任何模板助手关系无关。这是插入网格的正确方法吗？我的HTML中的错误是不允许单击按钮吗？

Answer 1

看起来你已经混淆了模板的名称。如果它是您所指的grid模板中的按钮，则需要将行Template.button.events({更改为Template.grid.events({，然后您会看到单击按钮时正在执行的功能。

帮助者在模板中

1 个答案: