web-dev-qa-db-ja.com

jadeテンプレート内でのJavaScript関数の実行

私はnodejsを初めて使用し、htmlコンテンツのjadeファイルを作成しようとしていますmyfile.jade：ファイルの内容は次のとおりです。

extends layout
block content
   script
     function capitalize(s) { 
       console.log("Testing js exec");
       return s.charAt(0).toUpperCase() + s.slice(1); 
     };
  table
    - each item in list
      tr
        td
          a(href="/collection/#{item.name}") #{capitalize(itemName)}

ただし、実行すると次のエラーがスローされます。

Error: mweb/views/collections.jade:8
    6|   script
    7|     function capitalize(s) { 
  > 8|       console.log("Testing js exec");
    9|       return s.charAt(0).toUpperCase() + s.slice(1); 
    10|     };

unexpected text ;

Console.logを削除すると、次のエラーがスローされます。

TypeError: mweb/views/collections.jade:18
  > 18|             a(href="/collection/#{item.name}") #{capitalize(itemName)}

私の知る限り、jadeのコンパイル中にCapitalizeが呼び出され、scriptタグもHTMLにコンパイルされるため、関数は使用できません。この呼び出しをa）サーバー側またはb）クライアント側で評価する最良の方法は何ですか？

THX

javascriptnode.jsexpresspug
16
Kiran

生成するJSではなく、jadeのスコープで関数を定義する必要があります。

block content
   -  function capitalize(s) { return s.charAt(0).toUpperCase() + s.slice(1); };
  table
    - var list = ['one', 'two']
    - var itemName = 'test test'
    - each item in list
      tr
        td
          a(href="/collection") #{capitalize(itemName)}

しかし、テンプレートの外にそれを持ち、ヘルパーオブジェクトに参照を渡す方がおそらく良いです

20
Andrey Sidorov

これは本当に古いと思いますが、jadeで関数を宣言するときは、

script.

ない

script

ピリオドは違いを生み、翡翠がHTMLではなく実際にコードであることを認識できるようにします。

8
user1241388

これによって#{capitalize(itemName)}は、コントローラー（バックエンド）からテンプレートに渡される関数を呼び出そうとしています。

たとえば（/ routes/index.js）：

res.render('index', { title: 'Express test', fs : { echo : lang} });

index.jadeにいる間

 a(href='/register') #{fs.echo('xxx')}

どこ

lang

いくつかのパラメーターを取る、以前に定義された関数です。

4
gregiolo