【发布时间】:2016-03-18 19:27:24
【问题描述】:
不使用 publish 或 waitOn 或其他高级技术用于学习目的。不知怎的,我无法让它工作。
Router.route('/browse/:_id', function(){
this.render('navigation', {to: 'navbar'});
this.render('header', {to: 'header'});
this.render('website', {
to: 'main',
data: function(){
return {
websites: Websites.findOne({_id: this.params._id}),
comments: Comments.find({siteId: this.params._id})
}
}
});
});
此代码适用于“cmets”,而“网站”无法呈现。
只有当我这样返回时,“网站”下的字段才会呈现为 HTML:
data: function(){ /*This works for websites but if used on comments it won't*/
return Websites.findOne({_id: this.params._id})
}
而对于“cmets”,它仅在我以对象表示法或键值对给出时才有效:
data: function(){ /*This works for comments but if used on websites it wont*/
return {comments: Comments.find({siteId: this.params._id})}
}
我的问题是我需要从同一个模板中的两个集合中获取数据。非常欢迎任何建议。谢谢!
编辑还包括我的 HTML 模板:“网站”模板
<template name="website">
<div class="container">
/*solved by including #with websites here*/
<div class="website">
<div class="website-header js-url">
<h4>{{title}}</h4>
</div>
<div class="website-body">
<tr><td>URL:</td> <td>{{url}}</td></tr>
<tr><td>Description</td><td>{{description}}</td></tr>
<div class="votes">
<div class="upvote_row">
<tr>
<td>Up Votes:</td>
<td>{{upVote.length}}<a href="#" class="btn btn-default js-upvote"><span class="glyphicon glyphicon-arrow-up" aria-hidden="true"></span></a></td>
</tr>
</div>
<div class="downvote_row">
<tr>
<td>Down Votes:</td>
<td>{{downVote.length}}<a href="#" class="btn btn-default js-downvote"><span class="glyphicon glyphicon-arrow-down" aria-hidden="true"></span></a></td>
</tr>
</div>
</div>
<tr><td>Posted By:</td><td><a href class="">{{createdBy}}</a> on {{createdOn.toDateString}} at {{createdOn.toLocaleTimeString}} </td></tr>
</div>
</div>
/* /with */
<div class="comments">
<h5>Comment Section</h5>
{{#if currentUser}}
<a class="btn btn-default js-toggle-comment-form" href>
<span class="glyphicon glyphicon-comment" aria-hidden="true"></span>
</a>
{{/if}}
<div id="comment_form" class="hidden_div">
<form class="js-save-comment-form">
<div class="form-group">
<label for="user_comment">Add Comment</label>
<input type="textfield" class="form-control" id="user_comment" placeholder="Your views on this website" required>
</div>
<button type="submit" class="btn btn-default">Submit</button>
<button class="btn btn-default js-cancel-submit">Cancel</button>
</form>
</div>
<ol>
{{#each comments}}
{{>comment_item}}
{{/each}}
</ol>
</div>
</div>
</template>
然后我的评论模板完美无缺。
<template name="comment_item">
<li class="card-panel teal darken-1 comments">
<blockquote>
<p class='card-content'>
{{userComment}}
</p>
<footer>
<a href="{{url}}">{{postedBy}}</a> on {{postedOn.toDateString}} at {{postedOn.toLocaleTimeString}}
<a href="#" class="btn btn-default js-upvote">
<span class="glyphicon glyphicon-arrow-up" aria-hidden="true"></span>
<span class="badge badge-notify">{{upVote.length}}</span>
</a>
<a href="#" class="btn btn-default js-downvote">
<span class="glyphicon glyphicon-arrow-down" aria-hidden="true"></span>
<span class="badge badge-notify">{{downVote.length}}</span>
</a>
</footer>
</blockquote>
</li>
</template>
【问题讨论】:
-
两件事:1.) 我会尝试使用一个模板,其导航、页眉、页脚等都包含在模板中,然后渲染一个模板。 2.) 我不知道它为什么会这样,但它可能与 findOne() 将返回一个对象而 find() 将返回一个游标这一事实有关。尝试使用 find().fetch() 代替吗?
标签: javascript meteor iron-router