Module hbs Express.js - enregistrer les partiels depuis le fichier .hbs

Question

J'utilise le handlebars.js hbs wrapper dans express.js. J'ai des modèles qui fonctionnent bien, mais j'ai besoin d'ajouter des partiels pour être rendu avec mes vues.

Je voudrais faire quelque chose comme ceci:

hbs.registerPartial('headPartial', 'header'); 
// where "header" is an .hbs file in my views folder 

Cependant, il est de lancer une « tête partielle ne peut être trouvée ».

Je peux faire fonctionner le registrePartial si je passe une chaîne de caractères html au second paramètre, mais je voudrais utiliser des fichiers de vue séparés pour mes partiels.

Je n'ai trouvé aucune documentation à ce sujet, mais j'espère que quelque chose me manquera.

Est-ce que quelqu'un sait comment utiliser les fichiers view dans la méthode registerPartial? Si oui, comment puis-je l'implémenter?

MISE À JOUR

Pour donner plus de contexte, permettez-moi d'ajouter plus de code. Voici mon fichier "serveur" - app.js

var express = require('express') 
, routes = require('./routes') 
, hbs = require('hbs'); 

var app = module.exports = express.createServer(); 

// Configuration 

app.configure(function(){ 
    app.set('views', __dirname + '/views'); 
    app.set('view engine', 'hbs'); 
    app.use(express.bodyParser()); 
    app.use(express.methodOverride()); 
    app.use(app.router); 
    app.use(express.static(__dirname + '/public')); 
}); 

app.configure('development', function(){ 
    app.use(express.errorHandler({ dumpExceptions: true, showStack: true })); 
}); 

app.configure('production', function(){ 
    app.use(express.errorHandler()); 
}); 

// this is the line that generates the error 
hbs.registerPartial('headPartial', 'header'); 

// What I'm expecting is for "headPartial" to be a compiled template partial 
// of the template within views/header.hbs, but it is not loading this way. 
// If I do something like hbs.registerPartial('headPartial', '<p>test</p>'); 
// then it does work. I need to know how to pass an .hbs file to the 
// registerPartial method. 

// Routes 
app.get('/', routes.index); 

app.listen(3000); 

Et voici mon fichier routes.index:

exports.index = function(req, res){ 
    res.render('index', { title: 'Express' }) 
}; 

Dans mon dossier vues, j'ai trois modèles:

views/ 
    header.hbs (this is my partial) 
    index.hbs 
    layout.hbs 

Dans mon fichier index.hbs, j'appelle la partie 'headPartial' partielle avec:

{{> headPartial}} 

Toute aide est grandement appréciée.

Answer 1

Ce code charge tous les modèles partiels dans un répertoire et les met à la disposition par nom de fichier:

var hbs = require('hbs'); 
var fs = require('fs'); 

var partialsDir = __dirname + '/../views/partials'; 

var filenames = fs.readdirSync(partialsDir); 

filenames.forEach(function (filename) { 
    var matches = /^([^.]+).hbs$/.exec(filename); 
    if (!matches) { 
    return; 
    } 
    var name = matches[1]; 
    var template = fs.readFileSync(partialsDir + '/' + filename, 'utf8'); 
    hbs.registerPartial(name, template); 
}); 

Answer 2

On dirait que la création d'une variable et en tirant dans le code du modèle fonctionne manuellement:

var hbs = require('hbs') 
    , fs = require('fs') 
    , headerTemplate = fs.readFileSync(__dirname + '/views/_header.hbs', 'utf8'); 

et plus tard:

hbs.registerPartial('headPartial', headerTemplate); 

Answer 3

Pour plus de commodité, registerPart EIAA fournit un moyen rapide de charger tous les partials d'un répertoire spécifique:

var hbs = require('hbs'); 
hbs.registerPartials(__dirname + '/views/partials'); 

Partials qui sont chargés à partir d'un répertoire sont nommés en fonction de leur nom, où les espaces et les traits d'union sont remplacés par un caractère underscore:

template.html  -> {{> template}} 
template 2.html -> {{> template_2}} 
login view.hbs  -> {{> login_view}} 
template-file.html -> {{> template_file}} 

À la votre!

Answer 4

Pour moi, j'avais le fichier modèle my-partial.HBS

Alors j'ai essayé d'y accéder via:

{{> my-partial }} 

Mais la partie a été stockée dans HBs my_partial quel que soit le nom de fichier.

Ceci est grâce à la version 3.1.0 HBS ligne 218

.slice(0, -(ext.length)).replace(/[ -]/g, '_').replace('\\', '/'); 

Ceci est dans le readme

Answer 5

Pour moi, j'ai une fonction comme:

var hbs = require('hbs'); 
var fs = require('fs');  
var statupfunc = { 
     registerHbsPartials : function(){ 
     //this is run when app start 
     hbs.registerPartials(__dirname + "/" + resource.src.views + '/partials');   
     }, 
     registerOneHbsPartials : function(event){ 
     //this is run for gulp watch 
     if(event.type == 'deleted') 
     { 
      return; 
     } 
     var filename = event.path; 
     var matches = /^.*\\(.+?)\.hbs$/.exec(filename); 
     if (!matches) { 
      return; 
     }  
     var name = matches[1];  
     var template = fs.readFileSync(filename, 'utf8');  
     hbs.registerPartial(name, template);  
     } 
    }; 

Run statupfunc .registerHbsPartials au démarrage de l'application, puis enregistrer la montre gulp avec statupfunc.registerOneHbsPartials pour vous inscrire sur la nouvelle création partials

gulp.task('watch', function() { 
    gulp.watch(resource.src.views + '/partials/*.*', statupfunc.registerOneHbsPartials); 
});