[英]Meteor: Render a template to the DOM on click
我遇到了一个看似简单的问题,但我找不到真正的解决方案。 我有2列:一栏概述了不同的任务,一栏则是单击每个任务所附的“更多信息”按钮时应显示有关该任务的详细信息的区域。 我的逻辑是:
我的主要问题是:如何告诉Meteor应该在task_long中呈现哪个任务? task_short通过每个任务循环获取其{{content}},{{name}}等参数。 但是,我该如何完成一项任务? 另外,我不太了解Blaze.remove。 我需要从哪里传递ViewId?
我非常感谢您的帮助!
这可以通过会话变量和模板中的一些条件来解决。 除非您确实在做一些花哨的事情,否则您无需使用Blaze.render
/ Blaze.remove
。 我不知道您的模板的确切结构,但是此示例应为您提供如何做的想法:
<body>
{{#each tasks}}
{{> task}}
{{/each}}
</body>
<template name="task">
<div class='short'>
<p>Here are the short instructions</p>
<button>More information</button>
</div>
{{#if isShowingLong}}
<div class='long'>
<p>Here are the long instructions</p>
</div>
{{/if}}
<hr>
</template>
if (Meteor.isClient) {
Template.body.helpers({
tasks: function () {
// return some fake data
return [{_id: '1'}, {_id: '2'}, {_id: '3'}];
}
});
Template.task.helpers({
isShowingLong: function () {
return (this._id === Session.get('currentTask'));
}
});
Template.task.events({
'click button': function () {
Session.set('currentTask', this._id);
}
});
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.