52

JadeとExpressを使用していますが、includeステートメントで変数を使用したいと思います。例えば：

app.js

app.get('/admin', function (req, res) {
  var Admin = require('./routes/admin/app').Admin;

  res.render(Admin.view, {
    title: 'Admin',
    page: 'admin'
  });
});

layout.jade

- var templates = page + '/templates/'

include templates

これを行うと、エラーが発生しますEBADF, Bad file descriptor 'templates.jade'

私も試しました

include #{templates}

無駄に。

4

5 に答える 5

43

AFAIK JADEは、ダイナミックインクルードをサポートしていません。私が提案するのは、テンプレートの外に「含める」ことです。

app.js

app.get('/admin', function (req, res) {
    var Admin = require('./routes/admin/app').Admin;
    var page = 'admin';

    var templates = page + '/templates/';

    // render template and store the result in html variable
    res.render(templates, function(err, html) {

        res.render(Admin.view, {
            title: 'Admin',
            page: page,
            html: html
        });

    });

});

layout.jade

|!{ html }
于 2012-08-26T19:44:40.533 に答える
20

これも機能します：

//controller
var jade = require('jade');
res.render('show', {templateRender: jade.renderFile});


//template
!= templateRender('my/path/'+dynamic+'.jade', options)

これにより、「ビューキャッシュ」設定を使用した場合に期待されるパフォーマンスが向上しない可能性があります（NODE_ENV ===「本番環境」ではデフォルトでオンになっています）。または、アプリを壊すこともできます（たとえば、新しいコードの展開中にファイルがハードドライブで利用できない場合）。また、テンプレートをコンパイルできないため、クライアント側または同形のアプリでこのトリックを使用しようとしても機能しません。

于 2014-10-23T10:03:56.987 に答える
7

このページが同じ質問をグーグルで検索しているのを見つけましたが、コンテキストが異なるため、後世のためにここに解決策（回避策を読んでください）を置くと思いました：

インクルードを変​​数から取得したより多くのコンテキストで囲みたかったのです。例：（簡略化）：

- var templates = page + '/templates/'
- var headid = page + 'head'
- var imgsrc = '/images/' + page
div(id=headid)    
  h1 #{page}
  img(src=imgsrc)
div(id=page)
  include templates

それは機能しないので（ジェイドはダイナミックインクルードをサポートしていません、気まぐれで指摘されているように）、私はミックスインとハイブリッド化しました：

（編集–以前の回避策よりも少しエレガントです:)

mixin page1
  include page1/templates

mixin page2
  include page2/templates

...

- for (var i = 0; i < 3; i++)
  - var page = 'page' + i
  - var headid = page + 'head'
  - var imgsrc = '/images/' + page
  div(id=headid)    
    h1 #{page}
    img(src=imgsrc)
  div(id=page)
    +page

私の以前の答え：

mixin templates(page)
  - var headid = page + 'head'
  - var imgsrc = '/images/' + page
  div(id=headid)    
    h1 #{page}
    img(src=imgsrc)

+templates('page1')
#page1
  include page1/templates/

+templates('page2')
#page2
  include page2/templates/

...

エレガントではなく、この方法でいくつかのものを含める必要がある場合は機能しませんが、ジェイドの少なくとも一部は動的です。

于 2014-03-12T22:37:29.710 に答える
1

なぜ翡翠の継承を使用しないのですか？

ミドルウェアレベルで必要なものをレンダリングします。

res.render('templates/' + template_name + '.jade')

共通の書き込みcommon.jade：

h1 This is a page
.container
  block sublevel
    h2 Default content

次に、拡張するファイルを書き込みますcommon.jade。

extends common.jade
block sublevel
  h2 Some things are here
于 2015-10-01T17:06:13.413 に答える
0

2019年で、Pug（以前のJade）ミックスインでの変数の使用が簡単になりました。

ミックスインを作成するときに、ミックスインに渡すことを期待している値に従ってパラメーターを指定できます。ドット表記を使用して、ネストされた値にアクセスできます。

mixinFile.pug：

mixin myMixin(parameter1, parameter2, parameter3)
    h2.MyHeading #{parameter1}
    p.MyParagraph #{parameter2.myVariable}
    .MyBox(id= parameter3.id)

index.pug：

include mixinFile
block content
    +MyMixin(variable1, variable2, variable3)

詳細については、 Mixinsの公式Pugドキュメントをご覧ください。

于 2019-04-08T08:18:59.740 に答える