将数据传递给partial时呈现空元素的手柄

Question

我已经在这个问题上困了一段时间了，不知道该怎么办。我将数据存储在mongoDB中，而我所要做的就是将数据渲染到我创建的部分中。我删除了partial中的所有内容，但仍然存在这个问题，所以我认为这是在检索数据并循环它的过程中完成的

问题1:当我呈现内容时，它会呈现，但我也会有5-6个空元素，无论是p标签，h1，img等等。

问题2:当我向img标签添加一个类时，它被应用为空标签app js的src：

const bodyParser = require('body-parser')
const { Console } = require('console')
require('dotenv').config()
const express = require('express')
const mongoose = require('mongoose')
const app = express()
const exphbs = require('express-handlebars')
const path = require('path')
const indxRoutes = require('./routes/index')

//Templataing engine
app.engine('handlebars', exphbs({defaultLayout: 'layout'}))
app.set('view engine', 'handlebars');
app.use(express.static(path.join(__dirname, '/public')));

app.use(indxRoutes)

mongoose.connect(process.env.DB_CONNECTION, () => {
    console.log('database connected')
})





app.listen(3000)

我的路线：

var express = require('express')
var router = express.Router()
var Product = require('../models/product')

router.get('/', (req, res) => {
    Product.find((err, docs) => {
        console.log(docs)
        if(err){
            res.send('error')
        }
        res.render('index', { products: docs})
    })
})

module.exports = router;

我现在删除了部分内容：

{{# each products}}
    {{# each .}}
 
        {{this.title}}
        {{this.description}}
        {{this.price}}
        
        <img src={{this.imagePath}} class="card-img">
      

    {{/each}}
    
{{/each}}

问题是，这是可行的，但我也得到了5-6个空的img标记，看起来像这样

<img src="class="card-img"">

如果我创建另一个元素，比如p，h1等，我会得到5-6个空标签

我真的希望这是有意义的。感谢大家的帮助。

Answer 1

所以我想通了。基本上，我将从mongo db收到的数据发送到模板，但我这样做了：

router.get('/', (req, res) => {
    Product.find((err, docs) => {
        let newDocs = JSON.stringify(docs)
        console.log(newDocs)
        let newDocss = JSON.parse(newDocs)
        console.log(newDocss)
        res.render('index', { products: newDocss})
    })
})

我通过控制台记录了每一步。本质上只是字符串和解析，它起作用了。我希望我能给出一个更详细的答案，但我还在学习。

我的猜测是mongoDB将数据存储在BSON中。通过使用stringify，它被转换为JSON，然后解析JSON数据，我们可以得到一个我们可以使用的数组。

有没有人能确认这是不是正确的想法？