【问题标题】:How to print the 'body' elements in the handlebars file?如何在车把文件中打印“body”元素?
【发布时间】:2019-11-05 22:13:59
【问题描述】:

我是 Hnadlebars 的新手。我不知道如何打印我从服务器获取的“body”元素作为响应。如何在“.hbs”文件中打印正文元素。

var express=require('express');
const app=express();
var fs=require('fs');
var path=require('path');
const hbs=require('hbs');
var request=require('request');
var bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
app.set('view engine','hbs');

app.get('/',function(req,res){
  res.sendFile(path.join(__dirname + '/prac.html'));
});

app.post('/route',function(req,res){
  request({
    url:'https://api.railwayapi.com/v2/route/train/'+req.body.tnum+'/apikey/<my-apikey>/',json:true
  },function(error,response,body){
    if(error){throw error;}
    res.render('route',body);
  });
});
app.listen(3000);
<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>My Route page</title>
  </head>
  <body>
  <form  action="/route" method="post">
    Train Number:<input type="text" name="tnum" required><br>
    <input type="submit" name="submit">
  </form>
  </body>
</html>

这是回应

{
  "response_code": 200,
  "debit": 1,
  "train": {
    "name": "KLK-NDLS SHATABDI EXP",
    "number": "12006",
    "days": [
      {
        "code": "MON",
        "runs": "Y"
      },
      {
        "code": "TUE",
        "runs": "Y"
      },
      {
        "code": "WED",
        "runs": "Y"
      },
      {
        "code": "THU",
        "runs": "Y"
      },
      {
        "code": "FRI",
        "runs": "Y"
      },
      {
        "code": "SAT",
        "runs": "Y"
      },
      {
        "code": "SUN",
        "runs": "Y"
      }
    ],
    "classes": [
      {
        "code": "3A",
        "available": "N"
      },
      {
        "code": "SL",
        "available": "N"
      },
      {
        "code": "1A",
        "available": "N"
      },
      {
        "code": "2S",
        "available": "N"
      },
      {
        "code": "FC",
        "available": "N"
      },
      {
        "code": "2A",
        "available": "N"
      },
      {
        "code": "CC",
        "available": "N"
      },
      {
        "code": "3E",
        "available": "N"
      }
    ]
  },

  "route": [
    {
      "no": 1,
      "scharr": "SOURCE",
      "schdep": "06:15",
      "distance": 0,
      "halt": -1,
      "day": 1,
      "station": {
        "name": "KALKA",
        "code": "KLK",
        "lng": null,
        "lat": null
      }
    },
    {
      "no": 2,
      "scharr": "06:45",
      "schdep": "06:53",
      "distance": 37,
      "halt": 8,
      "day": 1,
      "station": {
        "name": "CHANDIGARH",
        "code": "CDG",
        "lng": null,
        "lat": null
      }
    },
    {
      "no": 3,
      "scharr": "07:33",
      "schdep": "07:38",
      "distance": 104,
      "halt": 5,
      "day": 1,
      "station": {
        "name": "AMBALA CANT JN",
        "code": "UMB",
        "lng": null,
        "lat": null
      }
    },
    {
      "no": 4,
      "scharr": "08:10",
      "schdep": "08:12",
      "distance": 146,
      "halt": 2,
      "day": 1,
      "station": {
        "name": "KURUKSHETRA JN",
        "code": "KKDE",
        "lng": null,
        "lat": null
      }
    },
    {
      "no": 5,
      "scharr": "10:20",
      "schdep": "DEST",
      "distance": 302,
      "halt": -1,
      "day": 1,
      "station": {
        "name": "NEW DELHI",
        "code": "NDLS",
        "lng": null,
        "lat": null
      }
    }
  ]
}

【问题讨论】:

  • 这是产生的响应。
  • 你要展示什么?

标签: javascript html node.js handlebars.js


【解决方案1】:

这是syntax,你可以使用each来遍历数组

     <div class="entry">
          <h1>{{body.train.name}}</h1>
          <div class="body">
           {{#each body.train.days}}
         <div>{{this.code}}</div>
        {{/each}}
          </div>
        </div>

【讨论】:

  • 如果它对你有用,请接受答案,谢谢@Rajat
【解决方案2】:

确保您传入res.render('route',body); 的主体是数据类型对象,如果不是,请先使用JSON.parse(body) 对其进行解析。您可以使用typeof body 检查数据类型。 然后在前端你直接拥有body的所有属性。只需直接使用{{response_code}},而不是{{body.response_code}}。 要迭代几天使用:

{{#each train.days}}
         <div>{{this.code}} - {{this.runs}}</div>
{{/each}}

【讨论】:

    猜你喜欢
    • 2020-07-26
    • 1970-01-01
    • 1970-01-01
    • 2018-07-06
    • 2023-03-25
    • 2021-06-16
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多