【问题标题】:Render array of objects in Jade / Pug在 Jade / Pug 中渲染对象数组
【发布时间】:2017-06-10 21:39:12
【问题描述】:

我没有找到很多 Pug / Jade 模板的东西,所以我在这里尝试。 我一直在阅读迭代文档以及此链接here。

我正在使用 Node.js、Express 和 pug。到目前为止,我有一些功能服务器端可以收集有关用户的一些数据(我正在建立一个假约会网站作为学校项目) 所以我的代码服务器端看起来像这样:

router.post('/matchaSearch', function (req, res) {
  matchaSearch(pool, session.uniqueID)
     .then((results) => {

       res.results = JSON.stringify(results)
       console.log('result', results)
       res.render('./userMatch', {res})
       })
     .catch((err) => {
       console.error('error', err)
       res.status(500).send("we don't have any suggestions for you so far")
       })
     })

我可以在 iterm 中记录 results 并且我的所有数据都在这里,但在客户端方面则有点不同。

h1
 |Here are your suggestions
script.
 console.log(!{res.results}[0].username)
ul
  for username in res.results
    li= username

在这里,我可以在浏览器的控制台中记录来自res.results 的第一个用户名,但在我的页面中,我的 li 正在呈现:

这是您的建议

.[

.{

。”

.i

.d

。”

.:

.3

.3

你能理解我的问题吗? 它显示了我的对象数组中的每个字符。 我只是想将用户名显示为链接,以便显示包含一些建议用户的建议页面。

我想知道是否可以使用 jquery 将 html 渲染到我的 li 中,然后调用它,但我在这里也面临着一堵墙。 任何帮助都非常受欢迎! 谢谢。

【问题讨论】:

    标签: javascript node.js express pug


    【解决方案1】:

    {res} 对 javascript 没有任何意义。你应该提供一个包含键/值对的对象的模板:

    res.render('./userMatch', {results: results})
    

    然后你在模板中的循环变成了:

    ul
      for item in results
        li= item.username
    

    【讨论】:

    • 这行得通!太好了谢谢。你刚刚在学校帮助了另外 5 个人。干杯。
    【解决方案2】:
        h1
         |Here are your suggestions
        script.
         console.log(!{res.results}[0].username)
        ul
          for username in res.results
            li= username.username
    

    我认为用户名是对象,而您正在打印整个对象

    【讨论】:

    • 这只是打印空的 li 空白,它在我的对象中呈现的点与 char 一样多
    • 删除这个 JSON.stringify(results) 这是对你的对象数组进行字符串化,在 jage res.results 中被认为是 char 数组
    • 这是在我的哈巴狗页面中返回给我Cannot read property 'length' of undefined。但是我来了它可以是未定义的,因为我可以在 Iterm 之前记录变量?
    • 尝试在js文件中传递results变量而不是res并尝试console.log result.length
    • dNitro 的解决方案对我有用。问题出在服务器端。我的数据没有正确发送,我不得不使用{results: results}
    猜你喜欢
    • 2016-12-17
    • 2016-11-13
    • 1970-01-01
    • 2014-01-15
    • 1970-01-01
    • 2014-11-10
    • 1970-01-01
    • 1970-01-01
    • 2014-01-02
    相关资源
    最近更新 更多