如何在车把文件中打印“ body”元素?

时间:2019-06-24 06:27:36

标签: javascript html node.js handlebars.js

我是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
      }
    }
  ]
}

2 个答案:

答案 0 :(得分:0)

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

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

答案 1 :(得分:0)

请确保您要传递的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}}