248

Jade (http://jade-lang.com/) を使用して自分のページで JavaScript をレンダリングしようとしています。

私のプロジェクトは Express を使用して NodeJS にあり、頭にインライン JavaScript を書きたいと思うまで、すべてが正しく機能しています。ジェイドのドキュメントから例を取っても、私はそれを動作させることができません。何が欠けていますか?

翡翠のテンプレート

!!! 5
html(lang="en")
  head
    title "Test"
    script(type='text/javascript')
      if (10 == 10) {
        alert("working")
      }
  body

ブラウザーでレンダリングされた HTML の結果

<!DOCTYPE html>
<html lang="en">
<head>
  <title>"Test"</title>
  <script type="text/javascript">
    <if>(10 == 10) {<alert working></alert></if>}
  </script>
</head>
<body>
</body>
</html>

ここで間違いなく何かアイデアがありませんか？

4

8 に答える 8

400

'script' タグの後にドットを付けて使用するだけです。

script.
  var users = !{JSON.stringify(users).replace(/<\//g, "<\\/")}

https://github.com/pugjs/pug/blob/master/packages/pug/examples/dynamicscript.pug

于 2011-07-27T01:59:41.733 に答える
62

タイプを指定してスクリプトタグを使用し、ドットの前に含めるだけです。

script(type="text/javascript").
  if (10 == 10) {
    alert("working");
  }

これは次のようにコンパイルされます。

<script type="text/javascript">
  if (10 == 10) {
    alert("working");
  }
</script>
于 2014-04-05T11:48:57.587 に答える
3

私の答えの3番目のバージョン：

インライン Jade Javascript の複数行の例を次に示します。を使わないと書けないと思います-。これは、部分的に使用するフラッシュ メッセージの例です。お役に立てれば！

-if(typeof(info) !== 'undefined')
  -if (info)
    - if(info.length){
      ul
        -info.forEach(function(info){
          li= info
      -})
  -}

取得しようとしているコードは、質問のコードをコンパイルするためのものですか?

その場合、次の 2 つのことは必要ありません。1 つ目は、Javascript/スクリプトであることを宣言する必要はありません-。2 番目に、入力した後は、または いずれか-ifを入力する必要はありません。それがジェイドをかなり甘くしている理由です。{}

-------------- 以下の元の回答 ---------------

ifを先頭に追加してみてください-:

-if(10 == 10)
  //do whatever you want here as long as it's indented two spaces from
   the `-` above

ジェイドの例もたくさんあります:

https://github.com/visionmedia/jade/blob/master/examples/

于 2011-05-02T17:00:52.817 に答える
0

:javascriptフィルターを使用してください。これにより、スクリプト タグが生成され、スクリプトの内容が CDATA としてエスケープされます。

!!! 5
html(lang="en")
  head
    title "Test"
    :javascript
      if (10 == 10) {
        alert("working")
      }
  body
于 2013-05-26T10:54:38.753 に答える