PUG的对象迭代问题

时间:2018-10-09 23:19:47

标签: javascript express pug

我正在通过POST请求进行外部API调用,并发送要在PUG文件上呈现的数据。

这是我的路线:

app.post('/search', (req, res) => {
  request(`${url}${req.body.term}`, (error, response, body) => {
    if (!error && response.statusCode === 200) {
      const data = JSON.parse(body);
      const listData = data.itemListElement;

      console.log(listData[0].result.image.contentUrl);

      res.render('results', {
        searchData: listData,
        searchTerm: req.body.term
      });
    } else {
      console.log(error);
    }
  });
});

这是我当前的PUG文件:

html
  head
    title= Results
    link(rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous")
    body
      table(class="table table-striped")
        thead(class="thead-dark")
          tr
            th(scope="col") Result for #{searchTerm}
            th(scope="col") Description
            th(scope="col") Image
        tbody
            each item in searchData
                tr
                    td(scope="row")= item.result.name
                    td(scope="row")= item.result.description
                    td(scope="row")= JSON.stringify(item.result.image)

我在尝试“抓取”图像链接时遇到问题,因此我可以在表格的第三列上显示它。

当我从对象控制台输入console.log的键时,便可以检索它,并且可以在终端上看到链接。但是,当我尝试在我的PUG文件上显示链接时,出现错误Cannot read property 'contentUrl' of undefined

在对象的嵌套数组中找到图像链接:

listData[0].result.image.contentUrl

listData是包含所有对象的数组。

当我在路线中添加console.log(listData[0].result.image.contentUrl)时,我会在终端中看到链接

在此处提供的代码中,我对对象进行了字符串处理,以查看结果如何,您可以看到Url就在其中:

enter image description here

我几乎尝试了所有事情,不知道出了什么问题!

0 个答案:

没有答案