2016-09-01 14 views
1

私はejs5を使用するチュートリアルに従っています。そのチュートリアルでは、私は急行フラッシュを使い、私のroutes/usersページを整理してほしいと思っています。ハンドルバーにエクスプレスフラッシュを使用していますか?

router.get('/signup', function(req, res, next){ 
    res.render('accounts/signup', { 
     errors: req.flash('errors') 
    }); 
}); 

以降のES5はそうのようなものだ:自分のために

<% if (errors.length > 0) { %> 
<%= errors %> 
<% } %> 

は、私が代わりにエクスプレス・ハンドルを使用しています。最初の例のように、私は私のルータのコードを再フォーマットした場合

router.get('/signup', function(req, res, next){ 
    res.render('accounts/signup');  
}); 

しかし、私は404エラーを取得:そうのような/signup作品への私のルーティングがあるため今、私は、私のapp.jsファイルは必要なすべてのものを持っていることを知っています私のsignupルート。私はそれがなぜあるのか分からない。実証するために、これは最初の例と同じ私のものです。

//render the signup// 
router.get('/signup', function(req, res, next){ 
    res.render('accounts/signup', { 
     errors: req.flash('errors') 
    }); 
}); 

確かに、私のメインのapp.jsファイルには、次のものが含まれています

var flash = require('express-flash'); 
app.use(flash()); 

これに加えて、私はまた、ハンドルを使用してEJSスクリプトを複製する方法がわからないと思います。この作品のようなことをやろうか?

{{#if errors.length > 0}} 
    {{errors}} 
{{/if}} 

私が最初にサインアップルートを表示する必要があるため、これをテストすることはできません。

+1

を.handlebarsするには、 'handlebars'または'表現-handlebars'を使用していますか? –

+0

申し訳ありません。エクスプレスハンドルバー –

答えて

1

フラッシュヘルパーを登録してメインテンプレートで使用できます。 view.js

// set context for the req, res 
app.use(require('./../web/helpers/view').setContext); 

exphbs.create({ 
    extname  :'hbs', 
    layoutsDir : '/path/', 
    defaultLayout: 'main', 
    helpers  : require('/path/to/view').helpers, // this is where you can register a helper. 
    partialsDir : [ 
     '/path/' 
    ] 
}); 

、フラッシュメッセージからHTMLを構築する方法を記述します。

'use strict'; 

const _ = require('lodash'); 

let _req, _res; 

// build html for flash messages. 
function renderFlashMsg() { 
    let flash = _req.flash(), 
     out = '', 
     types = ['success', 'error', 'info']; 

    _.each(types, (type) => { 
     if (flash[type]) { 
      out += '<div class="flash-msgs '+ type +'">'; 
      out += '<h2><span>' + type + '</span></h2>'; 
      out += '<ul>'; 

      _.each(flash[type], (msg) => { 
       out += `<li>${msg}</li>`; 
      }) ; 

      out += '</ul></div>'; 
     } 
    }); 

    return out; 
} 

module.exports = { 
    'setContext': (req, res, next) => { 
     _req = req; 
     _res = res; 
     next(); 
    }, 
    'helpers': { 
     renderFlashMsg 
    } 
}; 

今、あなたは自分のmainレイアウトファイルにrenderFlashMsgを使用することができます持っています。

{{{renderFlashMsg}}}あなたがフラッシュメッセージをDOMに配置する場所を指定します。

1

ハンドルバーテンプレートのビューエンジンを設定していますか?ファイルの

app.engine('handlebars', exphbs({/* config */})); 
app.set('view engine', 'handlebars'); 

または変更拡張

関連する問題