Recherche…
Routage avec routeur de fer
Installer le routeur de fer
Depuis le terminal:
meteor add iron:router
Configuration de base
Router.configure({
//Any template in your routes will render to the {{> yield}} you put inside your layout template
layoutTemplate: 'layout',
loadingTemplate: 'loading'
});
Rendre sans données
//this is equal to home page
Router.route('/', function (){
this.render('home')
});
Router.route('/some-route', function () {
this.render('template-name');
});
Rendu avec données et paramètres
Router.route('/items/:_id', function () {
this.render('itemPage', {
data: function() {
return Items.findOne({_id: this.params._id})
}
});
});
Rend à un rendement secondaire
Router.route('/one-route/route', function() {
//template 'oneTemplate' has {{> yield 'secondary'}} in HTML
this.render('oneTemplate');
//this yields to the secondary place
this.render('anotherTemplate', {
to: 'secondary'
});
//note that you can write a route for '/one-route'
//then another for '/one-route/route' which will function exactly like above.
});
S'abonner et attendre les données avant le rendu du modèle
Router.route('/waiting-first', {
waitOn: function() {
//subscribes to a publication
//shows loading template until subscription is ready
return Meteor.subscribe('somePublication')
},
action: function() {
//render like above examples
}
});
S'abonner à plusieurs publications et attendre les données avant de générer le modèle
Router.route('/waiting-first', {
waitOn: function() {
//subscribes to a publication
//shows loading template until subscription is ready
return [Meteor.subscribe('somePublication1'),Meteor.subscribe('somePublication2')];
},
action: function() {
//render like above examples
}
});
Guide pour routeur de fer: http://iron-meteor.github.io/iron-router/
Avec FlowRouter
FlowRouter est plus modulaire que Iron Router.
Installez FlowRouter
meteor add kadira:flow-router
Rendu d'un modèle
En particulier, vous devez ajouter manuellement un package de rendu de mise en page avec votre moteur de rendu:
- Blaze Layout pour Blaze:
meteor add kadira:blaze-layout
- Réagir à la mise en page pour React:
meteor add kadira:react-layout
Ensuite, vous pouvez effectuer un rendu par modélisation dynamique (dans le cas de Blaze):
<template name="mainLayout">
{{> Template.dynamic template=area}}
</template>
FlowRouter.route('/blog/:postId', {
action: function (params) {
BlazeLayout.render("mainLayout", {
area: "blog"
});
}
});
Rendu d'un modèle avec des paramètres et / ou une requête
Les paramètres sont spécifiés sur la route, comme avec Iron Router:
FlowRouter.route("/blog/:catId/:postId", {
name: "blogPostRoute",
action: function (params) {
//...
}
})
Mais les paramètres ne sont pas transmis en tant que contexte de données au modèle enfant. Au lieu de cela, le modèle enfant doit les lire:
// url: /blog/travel/france?showcomments=yes
var catId = FlowRouter.getParam("catId"); // returns "travel"
var postId = FlowRouter.getParam("postId"); // returns "france"
var color = FlowRouter.getQueryParam("showcomments"); // returns "yes"