2014-07-17 127 views
2

我想给我的用户创建的文档模板(合同,电子邮件等)的可能性流星如何保存模板蒙戈

我想通了,将存储在蒙戈这些文档模板的最佳选择(也许我错了......)

我一直在寻找几个小时,但我无法弄清楚如何呈现这些文档模板与他们的数据上下文。

例子:

Template stored in Mongo: "Dear {{firstname}}" 
data context: {firstname: "Tom"} 

汤姆的网站上,他应改为: “亲爱的汤姆”

我怎样才能做到这一点?

编辑

一些研究之后,我发现了一个叫spacebars,编译器套件带来编译到客户端的选项:

meteor add spacebars-compiler 

然后我试过这样的事情:

Template.doctypesList.rendered = -> 
    content = "<div>" + this.data.content + "</div>" 
    template = Spacebars.compile content 
    rendered = UI.dynamic(template,{name:"nicolas"}) 
    UI.insert(rendered, $(this).closest(".widget-body")) 

但它不起作用。

该模板得到编译,但然后,我不知道如何解释它的数据上下文并将其发送回网页。

EDIT 2

我越来越接近感谢汤姆。

这是我做过什么:

Template.doctypesList.rendered = -> 
    content = this.data.content 
    console.log content 
    templateName = "template_#{this.data._id}" 
    Template.__define__(templateName,() -> content) 
    rendered = UI.renderWithData(eval("Template.#{templateName}"),{name:"nicolas"}) 
    UI.insert(rendered, $("#content_" + this.data._id).get(0)) 

该作品除外的事实名称不注入模板。 UI.renderWithData渲染模板,但没有数据上下文...

+0

不太可能;请参阅http://stackoverflow.com/a/24743280/586086。当Meteor开始时,模板正在服务器上编译,您必须将编译版本发送给所有连接的客户端。好主意,如果流星发布模板,以便客户可以制作新模板并共享它们。 –

+0

显然可以编译客户端(请参阅上面的我的编辑),但然后我卡住了。我如何渲染它? – ndemoreau

+0

为什么不使用'Template [templateName]'而不是更复杂的'eval(“Template。#{templateName}”)'?你在做什么应该可以,但是确保你只定义一次模板。 –

回答

0

使用UI.dynamic:https://www.discovermeteor.com/blog/blaze-dynamic-template-includes/

这是相当新的,并没有做它的方式对文档的某些原因。

+0

我想他是要求某种方式来输入一个模板作为客户端上的句柄风格的代码,并得到它编译和准备使用。这不是什么'{{> UI.dynamic}}'...... –

+0

@AndrewMao真的。要编译模板,您需要将spacebars发送到客户端或将编译版本的模板存储在mongo中 – imslavko

+0

@imslavko spacebar-compiler已在客户端上可用,是不是?他可以制作一个包并在客户端访问它。我想知道如果存储编译的模板将是正确的选择。我的意思是,现在Spacebars将html转换为htmljs,并使用Template.template_name.lookup获取数据,未来可能会更改此内容或其他内容。我认为最好的办法是将模板存储在mongo中并在客户端进行编译。如果我在某个地方错了,请纠正我。 – channikhabra

0

有达到你想要的几种方法,但我会做这样的:

你很可能已经使用underscore.js,如果不是流星具有核心包吧。

你可以使用下划线模板(http://underscorejs.org/#template)是这样的:

var templateString = 'Dear <%= firstname %>'

,然后再使用

_.template(templateString, {firstname: "Tom"})

得到Dear Tom编译。

当然,您可以在此期间将templateString存储在MongoDB中。
您可以根据需要设置分隔符,<%= %>只是默认值。

+0

好主意,但我想坚持流星模板引擎,因为我想使用一些流星功能。 – ndemoreau

1

你缺少的东西是对(无证!)Template.__define__的调用,它需要模板名称(挑选独特而聪明的东西)作为第一个参数和从空格键编译器获得的渲染函数。完成后,您可以使用@Slava建议的{{> UI.dynamic}}

还有一种方法可以做到这一点,通过使用UI.Component API,但我认为目前它非常不稳定,所以也许我会跳过这个,至少现在是这样。

+0

感谢您的提示。它使我取得了进步。我只剩下一个问题。在问题中查看我的编辑2。 RGDS – ndemoreau

0

编译后的模板基本上是htmljs表示法流星使用(或者我想是),它使用Template.template_name.lookup来呈现正确的数据。如果Template.template_name.lookup("data_helper")()返回正确的数据,请检查控制台。

我最近不得不解决编译模板客户端的确切(或类似)问题。你需要确保的事情的顺序是这样的:

  • 编译模板存在于客户端
  • 模板数据存在(有Template.template_name.lookup("data_name")()验证)
  • 渲染页面的模板现在

要编译模板,如@apendua建议,使用(这是我如何使用它和它的作品对我来说)

Template.__define__(name, eval(Spacebars.compile(
      newHtml, { 
       isTemplate: true, 
       sourceName: 'Template "' + name + '"' 
      } 
     ))); 

之后,您需要确保在页面上实际渲染模板之前,您要在模板中呈现的数据可用。这是我使用的网页渲染模板:

UI.DomRange.insert(UI.render(Template.template_name).dom, document.body); 

虽然我的使用情况进行渲染模板客户端是有所区别的(我的任务是实时更新的更改的模板覆盖流星的热码推),但这个工作在渲染模板的不同方法中最好。

您可以检查我的非常早期的阶段包里面做到这一点的位置:https://github.com/channikhabra/meteor-live-update/blob/master/js/live-update.js

我是相当新的现实世界的编程,所以我的代码可能非常丑陋,但可能是它会给你一些指点解决你的问题。 (如果你发现我在那里做一些愚蠢的事情,或者看到其他方式做得更好的东西,请随时放下评论。这是我获得改进的反馈的唯一方式,因为我是新手,基本上只有代码坐在我的黑暗的角落)。