[英]Rendering nested arrays of objects using handlebars
我在渲染hbs中的嵌套對象數組時遇到麻煩。
我需要在網頁上一起顯示每個圖像及其相應的鏈接(例如:圖像“ 1”的鏈接為“ a”)。
下面的代碼不起作用,還有其他解決方案嗎?
Server.js:
res.render('index.hbs', {
images: [ 1, 2, 3],
links: [a, b, c]
}
);
index.hbs:
{{#each images}}
{{#each links}}
<img> {{this}} </img> // should display all images
<a> {{this}} </a> // should display all links
{{/each}}
{{/each}}
您可以重新排列輸入以僅使用一個數組:
var images = [1, 2, 3];
var links = ['a', 'b', 'c'];
var objects = [];
for (var i = 0; i < images.length; i ++) {
objects[i] = { image: images[i], link: links[i] };
}
var data = { objects: objects };
res.render('index.hbs', data);
然后,您可以輕松地對其進行迭代:
{{#each objects}}
<img> {{image}} </img> // should display all images
<a> {{link}} </a> // should display all links
{{/each}}
您可以在這里看到這段代碼。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.