Meteor.js:如何在首页内外交换部分模板 [英] Meteor.js: how to swap partial templates in and out of the main page

问题描述

从流星开始. 寻找一种具有单个主页"的方法，该页面将包含一个区域，单击下一个/上一个"按钮可以在其中交换不同的部分模板. 我了解如何使用{{> step_1_Template}}语法静态地包含部分模板. 我需要的是在主页上永久保留下一个/上一个"按钮，然后单击下一个"按钮时-移除{{> step_1_Template}}，然后插入{{> step_2_Template}}. 怎么做?

Just starting with meteor. Looking for a way to have a single "main page", which would contain an area, in which different partial templates could be swapped in and out, at a click of a Next/Previous buttons. I understand how to include partial templates statically by using {{> step_1_Template}} syntax. What I need, is to have the Next/Previous buttons permanently on the main page, and, when the Next button is clicked - remove the {{> step_1_Template}} and insert the {{> step_2_Template}}. How is this done?

推荐答案

我的下意识的反应是，您应该只使用

My knee-jerk reaction is that you should just use iron-router. However, that may only make sense if you are swapping out templates based on routes. If you are sticking with the same route and only changing the partials then you can accomplish this with session variables.

当用户单击下一步"按钮时，您可以设置会话变量，例如:

When the user clicks the 'next' button you can set a session variable like:

Template.myTemplate.created = function() {
  Session.setDefault('currentStep', 1);
};

Template.myTemplate.events({
  'click #next': function() {
    var step = Session.get('currentStep');
    return Session.set('currentStep', step + 1);
  }
});

然后您可以添加一个帮助器，例如:

Then you can add a helper like:

Template.myTemplate.helpers({
  isStep: function(n) {
    return Session.equals('currentStep', n);
  }
});

最后，您的模板可以根据会话选择适当的部分:

Finally your template can select the proper partial based on the session:

<template name='myTemplate'>
  {{#if isStep 1}}
    {{> step_1_Template}} 
  {{/if}}
  {{#if isStep 2}}
    {{> step_2_Template}} 
  {{/if}}
</template>

这篇关于Meteor.js:如何在首页内外交换部分模板的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！