arrays - JADE、Nodejs 和 JSON 数据渲染

Question

我正在尝试使用数组在我的index.jade 页面上渲染一个表格，这些数组是使用index.js 页面中的日期和product_count 发送的。

        res.render('index', {
        title: 'Product Count (last 7 days)',
        keyy : dates,
        results: product_count
        });

在我的index.jade页面上它显示为:click here

从表格中，在每个表格单元格中，数据打印如下:

Amul Butter salted=2,凝乳乳雾200克=9,凝乳乳雾500克=15,Idli和Dosa面糊ID 1 Kg=12,Towness小 Jade 米去皮=4,Towness香蕉绿普通半熟=3,Towness香蕉Yalakki半熟=1,Towness苦瓜中号=1,Towness葫芦小号=1,T自有茄子长绿中=1，Towness celery =2，Towness Chow Chow中A级=1，Towness欧洲 cucumber =7，Towness去皮大蒜=1，

我想打印这些数据，每个数据在不同的行中用“，”分隔，如下所示:

Amul Butter salted=2
Curd Milky Mist 200 gms=9
Curd Milky Mist 500 gms=15
Idli and Dosa Batter ID 1 Kg=12
Towness Baby Corn Peeled=4
Towness Banana Green Regular Semi Ripe=3
Towness Banana Yalakki Semi Ripe=1
Towness Bitter Gourd Medium=1
Towness Bottle Gourd Small=1
Towness Brinjal Long Green Medium=1
Towness Celery=2
Towness Chow Chow Medium Grade A=1
Towness European cucumber=7
Towness Garlic Peeled=1

我将我的数组粘贴在这里，请帮助我如何获取换行符中的每个值，就是这样。

日期 = [ '2017 年 5 月 17 日', '2017 年 5 月 18 日', '2017 年 5 月 19 日', '2017 年 5 月 20 日']

product_count = [ 'Amul Butter salted=2,Curd Milky Mist 200 gms=9,Curd Milky Mist 500 gms=15,Idli and Dosa Batter ID 1 Kg=12,Towness Baby Corn Peeled=4,Towness Banana Green Regular Semi Ripe=3,Towness Banana Yalakki Semi Ripe=1,Towness Bitter Gourd Medium=1,Towness Bottle Gourd Small=1,Towness Brinjal Long Green Medium=1,Towness Celery=2,Towness Chow Chow Medium Grade A=1,Towness European cucumber=7,Towness Garlic Peeled=1,Towness Lemon  Medium =1,Towness Lettuce (Leafy Green)=5,Towness Mangalore Cucumber Medium=8,Towness Mint Leaves (Pudina Bunch)=2,Towness Musk Melon Stripes=1,Towness Onion Medium=1,Towness Papaya Raw=2,Towness Pumpkin Disco Town=3,Towness Raw Banana=1,Towness Red Radish (Long)=1,Towness Sambhar Onion=6,Towness Tomato Semi Ripe (Medium)=1',
  'Amul Butter salted=5,Curd Milky Mist 500 gms=11,Eggs Town  6 in 1=1,Paneer Nandini=2,Towness Banana Nendran Kerala Ripe=1,Towness Banana Yalakki Semi Ripe=10,Towness Bitter Gourd Medium=1,Towness Bread Multigrain Town 400 Gms=2,Towness Cluster beans=1,Towness Coriander Leaves=1,Towness European cucumber=1,Towness Ginger=1,Towness Lettuce (Ice Burg)=1,Towness Long Beans=2,Towness Mint Leaves (Pudina Bunch)=1,Towness Pumpkin Disco Town=1,Towness Red Cabbage=1,Towness Sambhar Onion=2',
  'Curd Milky Mist 500 gms=1,Hair Oil Coconut Parachute 250 Ml=1,Real Mixed Fruit 1 Ltr=1,Soda Lehar Evervess 500 Ml=1,Towness Alasande kai=1,Towness Banana Yalakki Semi Ripe=1,Towness Bread Multigrain Town 400 Gms=1,Towness Chutney Coconut Spicy=2,Towness Ginger=1,Towness Ladies Finger=1,Towness Nool Kol =1,Towness Sambhar Onion=1,Towness Tomato Semi Ripe (Medium)=1',
  'Naan Tawa (Half cooked) Town 5 Nos=1,Paneer Milky Mist 200 g=1,Real Mixed Fruit 1 Ltr=2,Towness Bread Kulcha=1,Towness Chikki Flax Seeds=2,Towness Chikki Melon seeds( Magaz)=2,Towness Coriander Leaves=7,Towness French Beans Grade A=6,Towness Ladies Finger=1,Towness Lemon  Medium =3,Towness Onion Medium=2,Towness Red Cabbage=1,Towness Sambhar Onion=1,Towness Tender Coconut=1,Towness Tomato Ripe (Medium)=1,Towness Tomato Semi Ripe (Medium)=1' ]

请帮助我。如果您有任何疑问，请在下面提及。从现在起我完全在线。

Answer 1

我已设法为您的案例找到可能的解决方案。

您的res.render函数:

var result = [];
var tmp;
// change your , into break tags
for (var line in product_count) {
  result.push(product[line].replace(/,/g,'<br />'));
}
res.render('index', {
  title: 'Product Count (last 7 days)',
  keyy: dates,
  results: result,
});

然后，在您的 jade 文件中:

table
  tr
    each val in keyy
      th= val
  tr
    each val in results
      td!= val

请记住，您的 product_count 必须经过精心策划。使用 != 可能会被用于 XSS 攻击。

更好的解决方案是使用自定义过滤器: https://pugjs.org/language/filters.html

希望对您的情况有所帮助。