Javascript Meteor中的模态式登录
我正在尝试在Meteor中创建一个登录模式,类似于单击此处的“登录”链接时可以看到的模式-。这是以前链接的站点的回购- 我在Subtitles应用程序的文件中看到,它使用会话变量和HandlebarJS“if”语句来获得效果,但我似乎无法掌握发生了什么,无法创建自己的 如果我能得到一些非常基本的工作,我可以从那里开始。有人能提供一个简单的解释或例子吗 编辑 我意识到我的目的更多的是使用手柄和会话变量来获得类似模态的效果。大概是这样的:Javascript Meteor中的模态式登录,javascript,meteor,Javascript,Meteor,我正在尝试在Meteor中创建一个登录模式,类似于单击此处的“登录”链接时可以看到的模式-。这是以前链接的站点的回购- 我在Subtitles应用程序的文件中看到,它使用会话变量和HandlebarJS“if”语句来获得效果,但我似乎无法掌握发生了什么,无法创建自己的 如果我能得到一些非常基本的工作,我可以从那里开始。有人能提供一个简单的解释或例子吗 编辑 我意识到我的目的更多的是使用手柄和会话变量来获得类似模态的效果。大概是这样的: <template name="overlay">
<template name="overlay">
{{#if overlay}}
<div id="templateToShow">
<h1>Content</h1>
</div>
{{/if}}
</template>
{{#如果覆盖}
内容
{{/if}
布局的一部分:
<template name="layout">
{{>overlay}}
{{>navBar}}
<div>
{{>yield}}
</div>
</template>
{{>覆盖}
{{>navBar}
{{>产量}
重叠显示将基于单击事件 我有一个工作模式,但不用于登录。在本例中,下面的代码段是模态的HTML(为简单起见,我省略了模板的其余部分)。当用户在我的应用程序的帐户管理页面上尝试删除他/她自己的管理员访问权限时,它基本上会闪烁确认模式
<template name="manageProject">
<div class="modal fade" id="checkAdminDelete">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title"><div class="alert alert-danger">Warning: You are deleting your own administrator access!</div></h4>
</div>
<div class="modal-body">
<p>You have chosen to delete your own administrator access. Please confirm, as you will not be able to restore it without the actions of another administrator.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" id="cancelDelete" data-dismiss="modal">Cancel This Action</button>
<button type="button" id="confirmDelete" class="btn btn-primary" data-dismiss="modal">Confirm This Action</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
希望这有帮助 哎呀!只需将会话变量设置为“true”。应该仔细阅读
<template name='overlay'>
{{#if overlay}}
<div class='content'>
<h1>Content</h1>
</div>
{{/if}}
</template>
})您是在努力显示覆盖还是在创建自定义登录模板?只是在显示覆盖而已。模板,帐户创建等。我能弄明白。谢谢。我不一定追求引导的模态特性,而是使用手柄的模态效果。一种
{{{#if overlay}}……
<template name='overlay'>
{{#if overlay}}
<div class='content'>
<h1>Content</h1>
</div>
{{/if}}
</template>
Template.someTemplate.events({
"click .someLink": function(e) {
e.preventDefault;
Session.set("overlay", true);
}
})
Template.overlay.helpers({
overlay: function() {
return Session.get("overlay");
}