简体   繁体   English

流星模板不起作用/空白页

[英]Meteor template not working/blank page

I am using Cloud9 and the Meteor package. 我正在使用Cloud9和Meteor软件包。

I have been given instructions to create a keypad template and to implement it. 已指示我创建和执行键盘模板。 I have followed all of the instructions however the page goes blank when I call the template like this {{> myKeypad}} 我已按照所有说明进行操作,但是当我像这样{{> myKeypad}}调用模板时,该页面将变为空白

If I do {{myKeypad}} the page does not go blank but the template does not appear. 如果我执行{{myKeypad}}该页面不会空白,但不会出现模板。

This is my code: 这是我的代码:

<body>
  <h1>Week 2</h1>

<ul class="nav navbar-nav">
  <li><a class="navbar-brand">asdadsada</a></li>
  <li><a>Test1</a></li>
  <li><a>Test2</a></li>
  <li><a>Test3</a></li>
  </ul>
<br />
<br />
<br />
<button class="btn btn-default" type="submit">Button
<span class="glyphicon glyphicon glyphicon-ok"></span>
</button>

<div class="container">

  <div class="row">

    <div id="left-box" class="col-md-4">
      adadasdasd
      </div>
      <div id="right-box" class="col-md-8">
        asdasdad
        {{myKepad}}
        </div>

    </div>



  </div>

<template name="myKeypad">
  <button class="btn {{button1class}}">1</button>
  <button class="btn {{button2class}}">2</button>
  <button class="btn {{button3class}}">3</button>
  <button class="btn {{button4class}}">4</button>
  <button class="btn {{button5class}}">5</button>
  <button class="btn {{button6class}}">6</button>
  <button class="btn {{button7class}}">7</button>
  <button class="btn {{button8class}}">8</button>
  <button class="btn {{button9class}}">9</button>
</template>

</body>

And this is in the meteor.js 这是在meteor.js中

if (Meteor.isClient) {


  // counter starts at 0
  Session.setDefault('counter', 0);

  Template.hello.helpers({
    counter: function () {
      return Session.get('counter');
    }
  });

  Template.hello.events({
    'click button': function () {
      // increment the counter when button is clicked
      Session.set('counter', Session.get('counter') + 1);
    }
  });

Session.set("button1class", "btn-default");
Session.set("button2class", "btn-default");
Session.set("button3class", "btn-default");
Session.set("button4class", "btn-default");
Session.set("button5class", "btn-default");
Session.set("button6class", "btn-default");
Session.set("button7class", "btn-default");
Session.set("button8class", "btn-default");
Session.set("button9class", "btn-default");

Template.myKeypad.helpers( {
"button1class" : function () { return Session.get("button1class")},
"button2class" : function () { return Session.get("button2class")},
"button3class" : function () { return Session.get("button3class")},
"button4class" : function () { return Session.get("button4class")},
"button5class" : function () { return Session.get("button5class")},
"button6class" : function () { return Session.get("button6class")},
"button7class" : function () { return Session.get("button7class")},
"button8class" : function () { return Session.get("button8class")},
"button9class" : function () { return Session.get("button9class")},
});


}

I have no idea why the template is not showing/breaking the site and making it blank. 我不知道为什么模板不显示/破坏站点并使它空白。

<body> is considered a template . <body> 被视为模板 Therefore you are defining a template from inside another template's definition. 因此,您是从另一个模板的定义内部定义一个模板。 It is not permitted! 这是不允许的!

<template name="something">
  <template name="someotherthing">
    {{!-- INCORRECT --}}
  </template>
</template>

What you want to do is define your myKeypad template outside of your <body> : 您要做的是在<body> 之外定义myKeypad模板:

<body>
  <h1>Week 2</h1>
  <!-- ... -->
        {{> myKepad}}
  <!-- ... -->
</body>


<template name="myKeypad">
  <button class="btn {{button1class}}">1</button>
  <button class="btn {{button2class}}">2</button>
  <button class="btn {{button3class}}">3</button>
  <button class="btn {{button4class}}">4</button>
  <button class="btn {{button5class}}">5</button>
  <button class="btn {{button6class}}">6</button>
  <button class="btn {{button7class}}">7</button>
  <button class="btn {{button8class}}">8</button>
  <button class="btn {{button9class}}">9</button>
</template>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM