Express.js hbs模塊 - 從.hbs文件註冊偏好

Question

我在使用express.js中的handlebars.js hbs wrapper。我的模板工作正常，但我需要添加部分以使用我的視圖進行渲染。

我想要做這樣的事情：

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

然而，它拋出一個「頭部分無法找到」。

我可以使registerPartial工作，如果我傳遞一個HTML字符串到第二個參數，但我想爲我的partials使用單獨的視圖文件。

我還沒有找到這方面的任何文件，但希望我可能只是想失去一些容易。

有誰知道如何使用registerPartial方法中的視圖文件？如果是這樣，我該如何執行此操作？

UPDATE

爲了讓更多的方面，我要添加更多的代碼。 這裏是我的 「服務器」 文件 - 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); 

這裏是我的routes.index文件：

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

在我的意見的文件夾，我有三個模板：

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

在我的index.hbs文件中，我打電話給'headPartial'部分：

{{> headPartial}} 

任何幫助，非常感謝。

Answer 1

這code加載所有目錄中的部分模板，並使它們可通過文件名：

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

貌似創建一個變量，在模板代碼拉手工作品：

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

及更高版本：

hbs.registerPartial('headPartial', headerTemplate); 

Answer 3

爲方便起見，registerPart IALS提供了一個快速的方法來從一個特定的目錄中加載所有的諧音：

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

被從目錄中加載

局部模板是根據其文件名，這裏的空間和連字符以下劃線代替命名爲：

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

乾杯！

Answer 4

對我來說，我有我的部分模板文件。HBS

然後我試圖通過訪問他們：

{{> my-partial }} 

但部分被存儲在HBS作爲my_partial不管文件名。

這得益於HBS版本3.1.0線218

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

這是readme

Answer 5

對於我來說，我有這樣一個功能：

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

運行statupfunc .registerHbsPartials在應用程序啓動時，然後用註冊gulp手錶statupfunc.registerOneHbsPartials對新創建註冊諧音

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