Resa multipla nel modello di applicazione Meteor.js

Question

Ho un generale {{> yield}} per ferro-router in un file di layout che esegue il rendering delle mie pagine, che sono modelli.

In una delle mie pagine, ho un menu laterale e in base alla selezione in questo menu, voglio caricare diversi modelli relativi a questa pagina in questa pagina.

Come posso ottenere questo risultato?

Answer 1

Ho fatto una cosa simile usando l'opzione layout template del ferro-router. Dire che voglio creare una vista home con più viste/modelli all'interno di questa vista home che cambierà. In primo luogo vorrei dichiarare il mio percorso:

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

Qualora l'HTML per il modello di layout sarà simile:

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

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

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

In modo che i modelli di cui i rendimenti aside e footer vengono resi nel luogo specificato. Per il tuo caso puoi specificare una resa sidemenu.

No, è possibile avere un layout di base e un'idea per definire un altro percorso. Diciamo che lo chiamiamo differentHome.

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

Avviso su questa dichiarazione rotta Sto cambiando i modelli di rendimento, ma io non sto cambiando il modello di base che verranno resi nel rendimento principale. Ora su un evento è possibile ri-percorso che cambierà i due diversi modelli di rendimenti:

Router.go("differentHome"); 

Oppure è possibile utilizzare codice HTML per instradare, dice con un link.

EDIT (Haphazard Solution):

Usa sessione variabile a dettare la scelta del menu laterale.

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") 
    } 
}); 

Ora su un evento impostare la sessione per che cosa mai sideMenuChoice.