5

ヘッド、メニュー、コンテンツ、フッターを含むシンプルなページがあります。それらを別々のファイルに分割する必要があります。エクスプレスドキュメントを読んだ後、私は（4つのテンプレートを作成して）次のように書きました。

app.get('/', function(req, res) {
    var response = [null, null, null, null]
    , everyNotNull = function(elem) {
        return (elem !== null);
    }, sendResponse = function(type, str) {
        switch (type) {
            case 'head' : response[0] = str; break;
            case 'menu' : response[1] = str; break;
            case 'content' : response[2] = str; break;
            case 'footer' : response[3] = str; break;
        }

        if (response.every(everyNotNull)) {
            res.send(response.join(''));
        }
    };

    res.partial('head', {'title' : 'page title'}, function(err, str) {
        sendResponse('head', str);
    });

    res.partial('menu', {'active' : '/'}, function(err, str) {
        sendResponse('menu', str);
    });

    res.partial('index', {'title' : 'Home'}, function(err, str) {
        sendResponse('content', str);
    });

    res.partial('footer', {'nowdate' : (new Date()).getFullYear()}, function(err, str) {
        sendResponse('footer', str);
    });
});

それは動作しますが、私には少し汚いようです。部分的なテンプレートを使用するより良い方法はありますか？

4

1 に答える 1

5

あなたは何かが欠けているのではないかと疑うのは正しかった、あなたはそこで不必要な仕事をしている。

Expressは、テンプレートをつなぎ合わせます。res.render（）と呼び出したいビューの名前を呼び出すだけです。レイアウトとパーシャルは自動的に引き込まれます。

私のアプリでは、通常、以下のようにパーシャルを使用します。EJSへの参照を、使用しているテンプレートエンジン（翡翠、口ひげなど）に置き換えるだけです。

./lib/app.js

app.get('/', function(req, res) {
    var model = {
        layout:'customLayout', // defaults to layout.(ejs|jade|whatever)
        locals:{
            foo:'bar'
        }
    };
    res.render('index',model);
});

./views/layout.ejs

<html>
    <head><%- partial('partials/head') %></head>
    <body>
<%- partial('partials/menu') %>
<%- body %>
<%- partial('partials/footer') %>
    </body>
</html>

./views/index.ejs

<h1>Index page</h1>

./views/partials/menu.ejs

<div><a href='... </div>

./views/partials/head.ejs

<script>...</script>
etc.
于 2011-09-07T10:07:12.963 に答える