ejs内でJSONオブジェクトを繰り返し処理する部分

Question

以下のJSONファイル内で、各エントリをEJS部分内でループするようにしています。

{ 
    "default": { 
     "1": { 
      "id": "alertmessages", 
      "title": "Your Messages", 
      "subtitle": "Tasks waiting for your attention", 
      "image": "alert.png", 
     }, 
     "2": { 
      "id": "uploadr", 
      "title": "Upload", 
      "subtitle": "Upload", 
      "image": "baskets.png", 
     }, 
     etc............ 
    } 
} 

このJSONファイルをnode.jsに読み込んで解析し、ダッシュボードビューで利用できるようにしています。

var jsondata = JSON.parse(require('fs').readFileSync('./app/routes/dashboard/buttons.json', 'utf8')); 

var content = { 
    title: 'Dashboard', 
    user: req.user, 
    buttonsdata: jsondata 
}; 
res.render('dashboard', content); 

マイダッシュボード・ビュー以下のように、（この番号は変更になる場合があります）私は、デフォルトに含まれるすべてのオブジェクトをループにしようとしていた中で、部分的EJSが含まれています。私はJqueryなしでこれをやりたいしかし、私が他のスレッドで見つけた提案のいずれかを得るのが難しい。

console.log("<%= buttonsdata.default.[1].id %>") 

は私が見てきたループの例で使用されてbuttons.lengthを、試してみて、コンソールログ場合しかし、それだけで空白に来る、私が期待するものを私に与えます。 また、どのようにオブジェクトの構造全体を見るためにオブジェクトの内容全体をログに記録できますか？ 第3の - このオブジェクトは、このように、私が知ることができるのは、ejsを通じて利用可能ですが、JavaScriptのコアではなく、ejs < %%タグを使用してアクセスすることしかできません。これは正しい理解ですか？

Answer 1

1. あなたのJSONはオブジェクトのみが含まれ、それはそれで任意の配列を持っていないので、あなたは、オブジェクト全体を表示buttonsdata.length

2. を使用することはできません - の中からオブジェクトを表示しますコントローラではなく、あなたのテンプレートです。このオブジェクトはEJSで入手することができますどのように

3. 見にthis answerを見て - はい、それは正しい理解だ - 私はコアにより、ブラウザ内で実行のJavaScriptを意味するJavaScriptことを前提としています。 ejsテンプレート全体がバックエンドで処理されます。あなたがObject.keysを使用することができますjavascriptの

Answer 2

使用平野：

var obj = { 
    "default": { 
     "1": { 
      "id": "alertmessages", 
      "title": "Your Messages", 
      "subtitle": "Tasks waiting for your attention", 
      "image": "alert.png", 
     }, 
     "2": { 
      "id": "uploadr", 
      "title": "Upload", 
      "subtitle": "Upload", 
      "image": "baskets.png", 
     } 
    } 
}; 
Object.keys(obj.default).forEach(function(key) { 
    console.log(obj.default[key].id); 
}); 

今、あなたのコードによると、ビューで次のように動作するはずです：

<ul> 
<% Object.keys(buttonsdata.default).forEach(function(key) { %> 
    <li><%= buttonsdata.default[key].id %></li> 
<% } %> 
</ul>