Meteor.js 应用程序模板中的多重收益

2023-12-13

我在布局文件中有一个用于iron-router的通用{{>yield}},它渲染我的页面,这些页面是模板。

在我的一个页面中,我有一个侧面菜单,根据此菜单中的选择,我想在此页面中加载与此页面相关的不同模板。

我怎样才能实现这个目标?


我用iron-router做了类似的事情layout template选项。假设我想创建一个主视图,其中的多个视图/模板会发生变化。首先我要声明我的路线:

Router.map(function () {
  this.route('home', {
  path: '/',
  template: 'myHomeTemplate',
  layoutTemplate: 'layout',
  yieldTemplates: {
    'myAsideTemplate': {to: 'aside'},
    'myFooter': {to: 'footer'}
    }
  });
});

布局模板的 html 如下所示:

 <template name="layout">
   <aside>
     {{> yield region='aside'}}
   </aside>

  <div>
    {{> yield}}
  </div>

  <footer>
    {{> yield region='footer'}}
  </footer>
</template>

以便在产量中指定模板aside and footer在指定位置进行渲染。对于您的情况,您可以指定sidemenu yield.

不,你有基本的布局和想法,你可以定义另一条路线。说我们称之为differentHome.

Router.map(function () {
  this.route('differentHome', {
  path: '/differentHome',
  template: 'myHomeTemplate',
  layoutTemplate: 'layout',
  yieldTemplates: {
    'myDifferentAsideTemplate': {to: 'aside'},
    'myDifferentFooter': {to: 'footer'}
    }
  });
});

请注意,在此路线声明中,我正在更改收益模板,但我不会更改将在主收益中呈现的基本模板。现在,在活动中,您可以重新路由,这将更改两个不同的收益模板:

Router.go("differentHome"); 

或者您可以使用 html 进行路由,例如使用链接。

编辑(随意解决方案):

使用会话变量来指示侧菜单选项。

HTML:
<template name="main">
  ......
   <div class="sideMenu">   
     {{#if sideMenu1}}
        {{> side1Template}}
     {{/if}}

     {{#if sideMenu2}}
        {{> side2Template}}
     {{/if}}
   </div>
 </template>

JS:
Template.main.helpers({
    sideMenu1 : function () {
         return Session.equals("sideMenuChoice", "sideMenu1")  
    },
    sideMenu2 : function () {
         return Session.equals("sideMenuChoice", "sideMenu2")  
    }
 });

现在,在一个事件中,将会话设置为任何 sideMenuChoice。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Meteor.js 应用程序模板中的多重收益 的相关文章

随机推荐

  • INSERT,并获取自增值

    考虑下表 create table language id integer generated always as identity START WITH 1 INCREMENT BY 1 name long varchar constra
  • 在 PHP 中迭代嵌套数组

    我在此链接上有一个嵌套数组阵列样本 我正在使用下面的代码来解析它 但第二次和深度之外它什么也没有返回 但是尝试使用递归函数 printAllValues ArrXML function printAllValues arr keys arr
  • android中没有创建数据库

    在我的应用程序中 活动运行良好 但未创建数据库 logcat 中也没有错误 主要活动类别 package com example testdb import android os Bundle import android app Acti
  • vba sumifs单列中的多个条件

    假设我在 A 列和 B 列中有这样的内容 A 5 A 1 3 A 2 2 A 3 3 A 4 4 我想做 Application SumIfs range b b range b b A A 2 但这不起作用 数组值 我希望不经历 EVAL
  • 计算 MongoDB 中另一个字段分组的文档中某个字段中字符串实例的数量?

    我有一个特定的用例 我正在尝试找到一种方法在一个聚合管道中完成它 并且最好不需要对任何数据值进行硬编码 我想根据一个属性对文档进行分组 并查看文档中特定字段的值计数 示例数据 flightNum DL1002 status On time
  • Cocos2d 获取当前时间(以毫秒为单位)

    我尝试用谷歌搜索 但仍然找不到最佳答案 我想要的很简单 我只想获取当前时间 以毫秒为单位 我怎样才能在 cocos2d 中做到这一点 首先 一个类变量 CGFloat gameTime 然后在你的类中初始化 self scheduleUpd
  • 简单的xml添加属性

    当我使用 PHP 在 XML 中添加新元素时 如何设置属性 我的PHP代码是这样的
  • 在C中将int数组更改为float数组

    有谁知道如何将整数数组转换为浮点数组 你的问题措辞不好 但是 假设您已经声明了整数数组 您可以尝试如下操作 instantiate float array float fArray sizeOfIntArray step through e
  • 阅读 SICP 时使用什么解释器? [关闭]

    Closed 这个问题不符合堆栈溢出指南 目前不接受答案 我正在阅读 SICP 书 网址为http mitpress mit edu sicp 要运行示例代码 我应该使用哪个解释器 我考虑过 Eclipse 的 Dandelion Lisp
  • 修改j2me midlet

    我想更改开源应用程序中的一些字符串 测试目的 所以我使用 jad 反编译器反编译我的应用程序 原始类文件http dl dropbox com u 32657135 YourTube class 发出命令Jad exe Yourtube j
  • 具有多个规则的 jQuery 表单验证插件

    我正在使用 jQueryValidation 插件 Problem 我想在一个输入字段中使用多个模式规则 例如 form validate rules email required true email true password requ
  • 每季度生成日期序列

    我想生成一个日期序列one quarter间隔 具有开始日期和结束日期 我有以下代码 gt seq as Date 1980 12 31 as Date 1985 06 30 by quarter 1 1980 12 31 1981 03
  • 在手机间隙运行 https 请求

    我正在iPhone中开发phone gap应用程序 我想使用JQuery getJSON url function 访问https json 请求 但仅在应用程序中它不会返回任何内容 但在正常的移动Safari中它工作正常 尽管它在phon
  • 如何使用 watchOS 2 SDK 构建应用程序

    在上次提交申请时 我们收到了此警告 WatchKit 支持无效 从 2018 年 4 月 1 日开始 提交到 Apple Watch App Store 的所有应用程序都必须使用 watchOS 2 SDK 或更高版本构建 检查您的部署目标
  • 仅沿第三维在 3D 逻辑数组中使用 Matlab“查找”

    我有一个 3D 逻辑数组 例如 A randi 0 1 x y z 其中 x y z 是整数 有没有办法找到每个 x y 沿第三维 z 的第一个真值 我可以像这样循环执行 B zeros x y for ix 1 x for iy 1 y
  • 如何将自定义ListAdapter设置为appwidget中的列表视图?

    我有一个列表视图 我需要为每个列表项提供一个自定义视图 因此我创建了一个自定义 ListAdapter 它提供了视图和布局 如下所示 但是如何使用 RemoteViews 将这个 listAdapter 设置为小部件中的 ListView
  • 程序集编号转 ascii

    我正在使用 intel 上的 at t 语法来处理汇编程序 我迷路了 如何将寄存器中的整数转换为 ASCII 数字 假设我想转换数字 10 我会将数字 10 放入寄存器 eax 中 如果我只是将数字 48 添加到 eax ascii 符号将
  • ZipArchive::close():读取错误:是一个目录

    我试图找出这个问题 但我无法想象为什么它一直发生 我正在将文件添加到 ZipArchive 当我尝试关闭它时 它收到目标是目录的错误 但我很确定事实并非如此 这是 zip 函数的代码 function create zip folder d
  • 打算打开Goog​​le身份验证器

    有没有办法通过 Intent 打开 Google Authenticator 如果是 是否可以使用已填充的密钥来打开它 以使其对用户实用 我有一个更通用的代码 因此 您只需将包名称作为参数发送给方法openApp Context conte
  • Meteor.js 应用程序模板中的多重收益

    我在布局文件中有一个用于iron router的通用 gt yield 它渲染我的页面 这些页面是模板 在我的一个页面中 我有一个侧面菜单 根据此菜单中的选择 我想在此页面中加载与此页面相关的不同模板 我怎样才能实现这个目标 我用iron