在许多模板中,我想使用相同的功能,但必须在每个模板中定义它们.像这样:
function getNodesById(id){
return collection.find({sid:id}).fetch();
}
Template.navigation.getNodesById= function(id){
return getNodesById(id);
}
Template.body.getNodesById= function(id){
return getNodesById(id);
}
HTML:
Run Code Online (Sandbox Code Playgroud)<Template name="navigation"> ... {{#each getNodesById '1'}} ... {{/each}} ... </Template> <Template name="body"> ... {{#each getNodesById '1'}} ... {{/each}} ... </Template> ... <Template name="..."> ..... </Template>
有没有办法可以定义全局模板功能而不是模板？就像它:在javascript中:
defined global tempele.functionA = function(...){
return ...
}
在HTML中:
Run Code Online (Sandbox Code Playgroud)<Template name ="a"> {{#each functionA ...}} {{/each }} </Template> <Template name ="b"> {{#each functionA ...}} {{/each }} </Template> <Template name="..."> {{ #.. functionA ...}} .... {{/...}} </Template > …
根据http://handlebarsjs.com/expressions.html,我应该可以这样做:
<h1>{{article.title}}</h1>
但我似乎无法让它在流星中发挥作用.这是我的模板:
<template name="content">
{{#if item}}
<p>{{item.name}}</p>
{{/if}}
</template>
这是返回项目的JavaScript:
Template.content.item = function() {
return Items.findOne({ _id: Session.get("list_id") });
};
是的,该项确实有一个名为name:-) 的属性
当我这样做时,我发现Firebug中有一个错误 ret is undefined
这可以追溯到evaluate.js:
for (var i = 1; i < id.length; i++)
// XXX error (and/or unknown key) handling
ret = ret[id[i]];
return ret;
在错误发生时,ret引用该window对象.那是怎么回事？
我正在编写一个处理博客帖子列表的Meteor应用程序.所有博客文章都存储在名为"帖子"的集合中.我使用Iron Router进行路由.
我想向用户显示特定作者创建的所有帖子的列表.此列表将使用Spacebars显示.因此,我需要向模板提供数据.
据我所知,有两种方法可以做到这一点:
选项1示例:
Template.postList.helpers({
postsToDisplay: function(){
return Posts.find({author: 'someAuthor'});
}
})
选项2示例:
//Inside my route
data: function(){
return {postsToDisplay: Posts.find({author: 'someAuthor'})};
}
这两种方法之间是否存在显着差异？是否有理由偏爱另一个？有人提供更好的表现吗？
非常感谢您的回答!
我一直在按照教程制作一个简单的论坛,在最终得到所有代码后,它告诉我'模板未定义'
forum.html代码
<head>
<title>Forum</title>
</head>
<body>
{{> form}}
{{> posts}}
</body>
<template name="posts">
<h1>Posts</h1>
<ul>
{{#each posts}}
<li>
<h3>{{title}}</h3>
<p>{{body}}</p>
</li>
{{/each}}
</ul>
</template>
<template name="form">
<form>
<label>Post Title:
<input type="text" id="title" />
</label>
<label>Post Body:
<textarea id="body"></textarea>
</label>
<input type="submit" value="Submit" id="submit"/>
</form>
</template>
forum.js代码:
var Posts = new Meteor.Collection('posts');
if (Meteor.isClient) {
Template.posts.helpers({
Posts: function() {
return Posts.find();
}
});
}
Template.form.events = {
'click #submit': function(event){
event.preventDefault();
var title = $('#title').val();
var body = $('#body').val();
Posts.insert({
title: …我想让这段代码无反应.有办法吗？
Template.foo.helpers({
info: function(){
var user = Meteor.user();
if (user && user.profile)
return user.profile.info;
}
});
我知道你有办法 Foo.find({}, {reactive:false})
我想知道是否有相同的东西.
出于某种原因,这根本不起作用.
{{user_slugged username}}
这{{username}}是模板可用的变量.但是,它在助手中给出了一个null/undefined值.
这是我的帮手代码
UI.registerHelper('user_slugged', function(username) {
... other stuff... return things.
}
我遇到的问题是,当我尝试这样的事情时,{{user_slugged 'Hello'}}它会做正确的事情并返回预期的结果.
但是,当我尝试{{user_slugged username}}它时似乎不起作用,即使我可以轻松地显示{{username}}在同一行代码中.
这看起来很奇怪,现在我正在考虑向把手发送参数的方式助手可能已经改变了Meteor 0.8.0.如果是这样,如果有人能指出我正确的方向或给我一个问题的答案,那就太棒了.
编辑:澄清我能够使用{{username}}相同的行,{{user_slugged username}}因此这样的工作
<a href="{{user_slugged username}}">{{username}}</a>
username 是一个对象属性,在模板中可用,并且我试图将其作为参数发送给帮助程序.
我正在开始一个Meteor项目,我想在不同的页面上使用不同的body css类.如果我向身体添加一个css类,我得到:
Attributes on <body> not supported
我发现的唯一方法是使用JS添加类.有一个更好的方法吗？
如何使用模板助手编辑传递给使用pathForiron-router方法创建的路由的参数值？
我有这个模板助手:
Template.registerHelper('slugify', function(obj){
return _.slugify(obj);
});
在我的.html文件中我有这个:
{{#each menuItemsFromDB}}
{{#each arrayOfMenuItems}}
<a class="item category" href="">
{{this}}
</a>
{{/each}}
{{/each}}
在{{this}}上面的代码返回一个字符串,该类别的名称.因为我已经注册了模板助手,所以我可以通过以下方式来解决这个类别:
{{slugify this}}
然后我有这条路线:
this.route('List',{
path: '/list/:category_slug',
template: 'list',
controller: 'ListController'
});
我可以链接到此路由并通过以下方式将参数传递给此路由:
{{pathFor 'List' category_slug='the-value-i-passed'}}
但那将是难以编码的,它无法达到我想要的预期效果.
我希望它是动态的,使用'slugify'模板助手和铁路由器的pathFor方法,并使用值{{this}}.
我想要实现的是这样的,虽然下面的代码不起作用:
{{pathFor 'List' category_slug={{slugify this}} }}
通过以上线路实现我正在努力实现的目标是什么？
我希望我可以这样做:
{{pathFor 'List' category_slug=slugify(this) }}
要么
{{pathFor 'List' category_slug='{{slugify this}}' }}
我试图将第一张图片设置为"活动项目"我是一个Bootstrap Carousel.那么,有没有办法让集合中的第一个元素与其他元素不同？
{{#each pictures}}
{{#if @first}}
<div class="item active">
<img src="/pictures/{{fileName}}" alt="" />
</div>
{{else}}
<div class="item">
<img src="/pictures/{{fileName}}" alt="" />
</div>
{{/if}}
{{/each}}
呈现的页面仅显示{{else}}语句中的内容.尝试过使用{{if @first}},但它对我不起作用.
试图制作一些简单的把手帮手
Handlebars.registerHelper('if_eq', function(context, options) {
if (context == options.hash.compare)
return options.fn(this);
return options.inverse(this);
});
得到这个错误.
ReferenceError: Handlebars is not defined
什么是正确的方法.