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,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 半熟=1,Towness 苦瓜中号=1,Towness 葫芦小号=1,Towness 茄子长青中号=1,Towness 芹菜=2,Towness Chow Chow 中A=1,Towness 欧洲黄瓜=7 ,Townness Garlic Peeled=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

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

dates = [ 'May 17 2017', 'May 18 2017', 'May 19 2017', 'May 20 2017' ]

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

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