更新

Question

我正在学习流星来构建快速的网站原型。我正在尝试了解如何生成一组值来填充网站模板和部分内容。

我有一个layout.html模板

<template name="layout">
  <div class="container">
    <header role="banner">
      {{>site-header}}
    </header>
    <h1>This is {{siteLogo}}</h1>
    <main role="main">
      {{ yield }}
    </main>
    <footer role="contentinfo">
      {{> site-footer }}
    </footer>
  </div>
</template>

在main.js中的

我定义了以下内容：

Meteor.startup(function(){
  Session.set('siteLogo', 'the logo');
});
Template.site-header.helpers({
  siteLogo: function(){ return Session.get('siteLogo'); }
});
Template.layout.helpers({
  siteLogo: function(){ return Session.get('siteLogo'); }
});

有了这个，我可以将siteLogo的值传递给layout.html。

我有一个site-header.html partial

<template name="site-header">
  <h1>{{siteLogo}}</h1>
</template>

我似乎无法将siteLogo的值传递给partial。有没有办法做到这一点？是否有必要创建一个Session变量来预先填充一些值，或者我可以创建一个json设置列表并全局访问该值吗？

将在main.js中发布的内容，例如jekyll网站中的yaml配置文件：

siteSettings = [
   {
    siteLogo: "some brand name",
    otherValue: "something else"
   }
]

<小时/>

更新

<小时/> 我有点困惑，我一定是做错了。我已经创建了一个快速的新流星应用程序来测试它。

我有main.html

<head>
  <title>handlebar-helper</title>
</head>

<body>
  {{> header}}
  {{> hello}}
  {{> footer}}
</body>

<template name="hello">
  <h1>Hello World!</h1>
  {{greeting}}
  <input type="button" value="Click" />
</template>

<template name="header">
  <header>
    <h1>{{ headline }}</h1>
    <p>tagline</p>
  </header>
</template>

<template name="footer">
  <footer role="contentinfo">
    <h1>{{ headline }}</h1>
    <small>copyright</small>
  </footer>
</template>

和main.js

if (Meteor.isClient) {
  Template.hello.greeting = function () {
    return "Welcome to handlebar-helper.";
  };

  Template.hello.events({
    'click input' : function () {
      // template data, if any, is available in 'this'
      if (typeof console !== 'undefined')
        console.log("You pressed the button");
    }
  });
  Meteor.startup(function(){
    Session.set('headline', 'My fancy headline');
  });
  Handlebars.registerHelper('headline', function(){
    return Session.get('headline');
  });
}

if (Meteor.isServer) {
  // server code here
}

我仍然无法将headline的值传递给>header的{{1}}

如果我尝试将>footer放入Session.set块，我会收到语法错误Meteor.isServer

干杯

Answer 1

您是否为Template.site-header.helpers宣布了siteLogo函数？如果不是它将无法工作 - 您不能使用其他模板的帮助程序。如果您需要在各个地方使用siteLogo，最好使用Handlebars block helper，因为任何模板都可以访问这些内容。

<强>更新

Handlebars帮助器看起来像这样：

Handlebars.registerHelper('siteLogo', function() {
   return Session.get('siteLogo');
});

但是，如果您已经在siteLogo模板中获得了site-header帮助器，则表明其他错误，例如模板或帮助名称中的拼写错误。控制台中是否有错误？

更新2

如果要使用字典样式结构来存储反应数据，可以执行以下操作：

Session.set('myDict', {foo: 1, bar: 2});

Handlebars.registerHelper('myDict', function(key) {
   return Session.get('myDict') ? Session.get('myDict')[key] : null;
});

然后在您的模板中使用它：{{myDict 'foo'}}。显然，上面的格式在tempate helper中也可以正常工作，但只能从该模板中访问。三元运算符只是检查myDict是否已经初始化，然后让模板尝试查找其中一个键，这是页面加载时常见的Meteor问题。

顺便提一下，如果你发现Session变量是一种处理反应性字典数据结构的繁琐方法，那么很容易就可以自己动手了。 This是最好的介绍。

将值传递给流星部分

更新

1 个答案: