node/hapi.js에서 handlebar-layouts를 사용하는 방법

hapi.js 앱에서 핸들 막대 레이아웃을 렌더링하는 데 문제가 있습니다. 레이아웃은 훌륭하게 렌더링되지만 부분 렌더링은 전혀 렌더링되지 않고 공백 만 있습니다.node/hapi.js에서 handlebar-layouts를 사용하는 방법

나는 이런 식으로 선언하고 있습니다 :

var handlebars = require('handlebars'), 
    layouts = require('handlebars-layouts'); 
layouts(handlebars); 

server.views({ 
    engines: { 
    html: handlebars 
    }, 
    basePath: __dirname, 
    path: './views', 
    layoutPath: './views/layout', 
    partialsPath: './views/partials', 
    layout: true, 
    helpersPath: './views/helpers' 
});

및 보일러 플레이트 레이아웃

<html> 
    <body> 
    {{#content "body"}} 
     <h2>Welcome Home</h2> 
    {{/content}} 

    {{#content "foot"}} 

    {{/content}} 
</body> 
</html>

하고있는 게요

{{#extend "layout"}} 

    {{#content "body"}} 
     <h2>Sub page content</h2> 
    {{/content}} 

    {{#content "foot" mode="prepend"}} 
     <script src="assets/js/analytics.js"></script> 
    {{/content}} 
{{/extend}}

출처

2014-11-05 MonkeyBonkey

부분 HTML 밖으로 상자의 레이아웃을 지원합니다. 문제는 hapi의 레이아웃 지원을 handlebars-layouts 모듈과 함께 사용하려고한다는 것입니다. 그것은 효과가 없을 것입니다. 내장 레이아웃 지원을 사용하거나 핸들 바 레이아웃을 사용하십시오. 또한 레이아웃에서 {{#content "body"}} 대신 {{#block "body"}}{{/block}}을 사용해야합니다.

핸들 - 레이아웃 모듈 :

하는 index.js : 여기서 두 예는

var Handlebars = require('handlebars'); 
var HandlebarsLayouts = require('handlebars-layouts'); 
var Hapi = require('hapi'); 
var Path = require('path'); 

var engine = Handlebars.create(); 
HandlebarsLayouts.register(engine); 

var server = new Hapi.Server(); 
server.connection({ 
    host: '127.0.0.1', 
    port: 8000 
}); 

server.views({ 
    engines: { 
     html: engine 
    }, 
    path: Path.join(__dirname, 'views'), 
    partialsPath: Path.join(__dirname, 'views/partials)' 
}); 

server.route({ 
    method: 'GET', 
    path: '/item', 
    handler: function (request, reply) { 

     reply.view('item', { title: 'Item Title', body: 'Item Body' }); 
    } 
}); 

server.start();

보기/파셜/page.html :

{{#extend "layout"}} 

    {{#content "body"}} 
     <h2>{{title}}</h2> 
    {{/content}} 

    {{#content "foot" mode="prepend"}} 
     <script src="assets/js/analytics.js"></script> 
    {{/content}} 

{{/extend}}

보기/부분/layout.html :

<html> 
    <body> 
    {{#block "body"}} 
     <h2>Welcome Home</h2> 
    {{/block}} 

    {{#block "foot"}} 

    {{/block}} 
</body> 
</html>

개

보기/item.html는 :

{{#embed "page"}}{{/embed}} 

{{body}}

게요!의와 내장 레이아웃 지원 :

하는 index.js :

var Handlebars = require('handlebars'); 
var Hapi = require('hapi'); 
var Path = require('path'); 

var server = new Hapi.Server(); 
server.connection({ 
    host: '127.0.0.1', 
    port: 8000 
}); 

server.views({ 
    engines: { 
     html: Handlebars.create() 
    }, 
    path: Path.join(__dirname, 'views'), 
    layoutPath: Path.join(__dirname, 'views/layout'), 
    layout: true, 
    partialsPath: Path.join(__dirname, 'views/partials') 
}); 

server.route({ 
    method: 'GET', 
    path: '/item', 
    handler: function (request, reply) { 

     reply.view('item', { title: 'Item Title', body: 'Item Body' }); 
    } 
}); 

server.start();

뷰/레이아웃/layout.html :

<html> 
    <body> 
    {{> header}} 

    {{{content}}} 

    {{> footer}} 
</body> 
</html>

view/partials/footer.html :

<script src="assets/js/analytics.js"></script>

보기/파셜/HEADER.html 현재 :

<h2>{{@root.title}}{{^title}}Welcome Home{{/title}}</h2>

전망/item.html :의 예를 다음

{{body}}

출처

2014-11-05 15:30:44

을 "게요!의와 내장 레이아웃 지원"의 item.html은 HTML 이스케이프 된 문자열로 렌더링되며 모든 HTML이 브라우저의 텍스트로 표시됩니다. item.html의 내용을 HTML로 추가하려면 어떻게합니까? 또한 item.html 파일에 여러 개의 콘텐츠 영역을 추가하여 채울 수 있습니까? 예 : {{css}}, {{body}}, {{js}}? – Zambonilli

@ Zambonilli 누군가 내 대답을 편집했습니다. 변경 사항을 원래 답변으로 되돌 렸습니다. '{{content}} '대신'{{{content}}}'를 사용하십시오. 여러 콘텐츠 영역에 대한 확신이 없습니다. 시도해 보시고 효과가 없다면 새로운 질문을하십시오. –

감사합니다. 나는 기회가있을 때 여러 콘텐츠 영역을 테스트하려고 노력할 것이다. – Zambonilli

node/hapi.js에서 handlebar-layouts를 사용하는 방법

답변

관련 문제