web-dev-qa-db-ja.com

Jadeテンプレート、具体的なオブジェクトをページに渡す方法は?

私のnode.jsプロジェクト用のjadeテンプレートがあります。オブジェクトをjadeテンプレートに送信し、それをページ内の関数に渡したい(何かをレンダリングするため)。

私はこのようなサーバーから適切なものを送信すると確信しています

_res.render(__dirname + '/pages/viz.jade', {
    vizJson: newJson,
});
_

クライアントで私はこのようなことをします:

_script
    sunburst(#{vizJson})
_

したがって、スクリプト関数内で、サーバー側で作成したjsonを使用して視覚化を作成する関数を呼び出します。

問題は、レンダリングされたときにsunburst([Object object])のようになることです。また、JSONの文字列化されたバージョンを送信しようとしましたが、JSON.parse(#{vizJson})を実行すると、_Unexpected token &_のようなメッセージが表示されます。

私が送信するjsonは常に異なり、深度のレベルも異なります。

誰かが何をすべきか知っていますか?

ありがとう

37
Masiar

これが誰かの役に立つことを願っています。私はそれを次のように解決しました:

script
    sunburst(!{JSON.stringify(vizJson)})

! そしてその {...} stringifyメソッドをラップします。

76
Masiar

これを機能させるには、サーバーで文字列化する必要があります。

res.render(__dirname + '/pages/viz.jade', {
    vizJson: JSON.stringify(newJson),
});

次に、お伝えしたように、クライアントでJSONを解析します。

script
    sunburst(JSON.parse(#{vizJson}))

お役に立てば幸いです。

3
btford

奇妙なことに、私にとっての解決策は、JSON.parse。サーバー上のオブジェクトを文字列化し、!{vizJson}メソッドを使用して、オブジェクトをクライアントサイドで取得しました。

ドキュメントごとに、エスケープされていない文字列補間: http://jade-lang.com/reference/interpolation/

2
Airswoop1

JS側では、送り返します

res.render(__dirname + '/pages/viz.jade', {
    vizJson: JSON.stringify(newJson),
});

HTML側では、次のようなことがわかりました。

JSON.parse( '!{vizJson}' )

動作します。

0
Greg S