如何使用流星空格键模板动态呈现HTML? [英] How can I dynamically render HTML using Meteor Spacebars templates?

问题描述

因此，假设我将<div>{{name}}</div>和<div>{{age}}</div>存储在数据库中. 然后，我想获取第一个HTML字符串并将其呈现在模板-{{> template1}}中，该模板仅使用其中的{{name}}把手来呈现第一个字符串.然后，我要提供新生成的模板/html数据，以便它可以使用数据库中的实际name填充车把，以便获取<div>John</div>.我已经尝试过了

So let's say I'm storing <div>{{name}}</div> and <div>{{age}}</div> in my database. Then I want to take the first HTML string and render it in a template - {{> template1}} which just renders the first string with the {{name}} handlebar in it. Then I want to give that newly generated template/html data, so that it can fill in the handlebar with the actual name from the database, so that we would get <div>John</div>. I've tried doing

<template name="firstTemplate">
    {{#with dataGetter}}
        {{> template1}}
    {{/with}}
</template>

其中template1定义为

Where template1 is defined as

<template name="template1">
    {{{templateInfo}}}
</template>

而templateInfo是帮助程序，它从数据库返回前面提到的带有字符串的html字符串.

And templateInfo is the helper that returns the aforementioned html string with the handlebar in it from the database.

dataGetter就是这样(只是一个例子，我正在使用名称不同的集合)

dataGetter is just this (just an example, I'm working with differently named collections)

Template.firstTemplate.dataGetter = function() {
    return Users.findOne({_id: Session.get("userID")});
}

我无法填充{{name}}.我已经尝试了几种不同的方法，但是看来Meteor并不理解字符串中的把手需要与数据一起评估.我使用的是0.7.0，所以没有Blaze，由于我使用的是其他软件包，我目前无法升级，他们到目前为止还没有0.8+版本支持.任何有关如何使它起作用的想法都将受到赞赏.

I can't get the {{name}} to populate. I've tried it a couple of different ways, but it seems like Meteor doesn't understand that the handlebars in the string need to be evaluated with the data. I'm on 0.7.0 so no Blaze, I can't upgrade at the moment due to the other packages I'm using, they just don't have 0.8+ version support as of yet. Any ideas on how I can get this to work are much appreciated.

推荐答案

如果您需要动态编译 复杂模板，我建议使用Kelly的答案.

If you need to dynamically compile complex templates, I would suggest Kelly's answer.

否则，您有两个选择:

1. 创建每个模板变体，然后动态选择正确的模板:

例如，创建模板

<template name="displayName">{{name}}</template>
<template name="displayAge">{{age}}</template>

然后将它们动态添加到

{{> Template.dynamic template=templateName}}

templateName是返回"age"或"name"

如果您的模板很简单，请自己执行替换.您可以使用Spacebars.SafeString返回HTML.

If your templates are simple, just perform the substitution yourself. You can use Spacebars.SafeString to return HTML.

function simpleTemplate(template, values){
      return template.replace(/{{\w+}}/g, function(sub) {
          var p = sub.substr(2,sub.length-4);
          if(values[p] != null) { return _.escape(values[p]); }
          else { return ""; }
      })
}
Template.template1.helpers({
  templateInfo: function(){
      // In this context this/self refers to the "user" data
      var templateText = getTemplateString();
      return Spacebars.SafeString(
          simpleTemplate(templateText, this)
      );
  }

这篇关于如何使用流星空格键模板动态呈现HTML?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！