Templates 在模板外部动态呈现元素的最佳实践

Templates 在模板外部动态呈现元素的最佳实践,templates,meteor,iron-router,Templates,Meteor,Iron Router,切换某个元素(由模板表示)的存在的最佳方式是什么,该元素是的直接子元素 我说的是一个模式框、通知、灯箱等。由某个用户事件或路由触发 示例:用户单击按钮后显示的新闻稿注册对话框。通过将/edit附加到项目的路径而触发的内容编辑覆盖 编辑: 我想到的第一个解决方案是使用会话来控制状态,然后将应用程序的所有模态和消息排列在主布局模板末尾的#if语句中,如下所示: <template name="layout"> <!-- yields and stuff --> {

切换某个元素(由模板表示)的存在的最佳方式是什么,该元素是
的直接子元素

我说的是一个模式框、通知、灯箱等。由某个用户事件或路由触发

示例:用户单击按钮后显示的新闻稿注册对话框。通过将
/edit
附加到项目的路径而触发的内容编辑覆盖


编辑:

我想到的第一个解决方案是使用会话来控制状态,然后将应用程序的所有模态和消息排列在主布局模板末尾的
#if
语句中,如下所示:

<template name="layout">
  <!-- yields and stuff -->

  {{#if isActiveModal 'editArticle'}}{{> editArticle}}{{/if}}
  {{#if ...
</template>

{{{if isActiveModal'editArticle'}{{>editArticle}{{/if}}
{{{#如果。。。
问题是模块化;如果队友在某个页面模板内工作,需要显示特定的消息或对话框,他或她必须编辑主布局以添加它。我希望有一些简单的方法可以有条件地将模板附加到


使用手头的工具应该是可行的,不是吗?

事实上,我在我的几个Meteor应用程序中都使用bootbox,它工作得很好,不会干扰Meteor的任何渲染。你可以在非bloc模式下使用正常的
警报
确认
提示
,以及自定义的
对话框
功能king way。提供智能套餐:

有关示例,请参阅我的一些应用程序和智能软件包(grep for
bootbox.
):


如果您使用最新版本的新模板引擎,您可以通过
UI.body
将body标签作为自己的特殊模板使用:

meteor update --release template-engine-preview-10.1
HTML:


{{{#发出警报}
{{>模态}
{{/与}}
{{message}}

JS:

if(Meteor.isClient){
UI.body.alert=函数(){
返回会话。获取(“模式警报”);
};
UI.body.events({
“单击.关闭”:函数(){
Session.set(“模式警报”,null);
}
});
}

自从我发布这个问题以来,Blaze变得更加复杂。元素现在可以在DOM中的任何位置呈现,同时保持逻辑视图层次结构。请参阅以下讨论:

我已经在下面插入了主要的大纲–完整的线程也有代码示例


[使用]
Blaze.render
将模板输出到DOM中的任意位置,例如直接在
内的可调光包装器中,同时在打开模板的视图和模式视图之间保持父子关系。这种关系是它们直接通信所必需的

(请记住,
会话
变量以及其他限制只能保存可序列化的数据…)

在层次结构完好无损的情况下,可以在模态和背景之间建立共享的反应性,并在另一个上调用方法。如果我们自愿使用
Blaze.renderWithData
,那么这两个模板甚至可以共享相同的数据上下文

手动遍历视图层次结构非常繁琐,但是使用中的
parent()
方法,这不是一个问题

根据用户是喜欢将模板实例用作“视图模型”还是喜欢传递信息,这两个模板之间的交互反应可以通过分配给父模板实例或视图上的属性的
new ReactiveVar
来调节,也可以通过更多的按需检索来调节


Blaze.render的整个练习可以通过使用诸如块帮助器模板和关键字参数之类的技巧进行适当的压缩,从而使所有内容都保持声明性。

目前,如果代码中没有添加一些难看的内容,就很难做到这一点,请查看我对这个类似问题的回答:“parties”中使用了这种“模式”Meteor core示例,因此在新的渲染引擎准备就绪之前,它是官方的解决方案。因此,要切换对话框的存在,您当前必须使用会话变量和动画(淡入/淡出)无缝集成是一件痛苦的事情。在不久的将来,我们将能够依靠经典的jQuery类切换。谢谢,但请参见上面的编辑。我认为这是同一种解决方案。这是一个很好的答案,但该项目不使用引导。我正在寻找一种通用模式。