【发布时间】:2021-05-09 02:22:36
【问题描述】:
我是 JS 和 Handlebars 的新手,非常感谢我正在从事的项目的一些帮助。我正在使用 AJAX 创建一个新类别,然后尝试从服务器获取该类别(当前,如果我刷新,新类别将消失。我了解 AJAX 是异步的,并试图从服务器(如果可能)。目前,我收到以下错误:
Handlebars:访问已被拒绝解析属性“_id”,因为它不是其父级的“自己的属性”。
从我所做的阅读来看,我相信这是因为 Handlebars 4.6.0 和 on 默认情况下禁止访问上下文对象的原型属性和方法。为了解决这个问题,我安装了@handlebars/allow-prototype-access 包,但我不确定如何在我的 app.engine 中使用它。有人可以帮忙吗?这是我的 app.js:
const {globalVariables} = require('./config/configuration')
const express = require('express');
const mongoose = require('mongoose');
const path = require('path');
const hbs = require('express-handlebars');
const {mongoDbUrl, PORT} = require('./config/configuration');
const flash = require('connect-flash');
const session = require('express-session');
const {selectOption} = require('./config/customFunctions');
const fileUpload = require('express-fileUpload');
const methodOverride = require('method-override');
const {allowInsecurePrototypeAccess} = require('@handlebars/allow-prototype-access');
const app = express();
/* Configure Mongoose to Connect MongoDB */
mongoose.connect(mongoDbUrl, { useNewUrlParser: true })
.then(response => {
console.log("MongoDB Connected Successfully.", { useNewUrlParser: true });
}) .catch(err => {
console.log("Database connection failed", err)
});
/* Configure express*/
app.use(express.json());
app.use(express.urlencoded({extended: true}))
app.use(express.static(path.join(__dirname, 'public')));
/*flash and session*/
app.use(session({
secret: 'anysecret',
saveUninitialized: true,
resave: true
}))
app.use(flash());
app.use(globalVariables);
app.use(fileUpload({
limits: { fileSize: 50 * 1024 * 1024 },
}));
/* Setup View Engine To Use Handlebars */
app.engine('handlebars', hbs({defaultLayout: 'default', helpers: {select: selectOption}}));
app.set('view engine', 'handlebars');
/* Method Override Middleware */
app.use(methodOverride('newMethod'));
/* Routes */
const defaultRoutes = require('./routes/defaultRoutes');
const adminRoutes = require('./routes/adminRoutes');
app.use('/', defaultRoutes);
app.use('/admin', adminRoutes);
app.listen(PORT, () => {
console.log(`Server is running on port 3000`);
})
这是我用来创建类别的 .handlebars 表单:
$("#create-category-button").on('click', function (e) {
e.preventDefault();
var data = $("#category-title").val();
$.ajax({
url: '/admin/category',
type: 'POST',
data: {name: data},
success: function (response) {
var html = `<tr>
<td>${response.title}</td>
<td class="d-flex justify-content-center">
<a href="/admin/category/edit/${response._id}" class="btn btn-sm btn-warning mr-2">Edit</a>
<form action="/admin/category/${response._id}?newMethod=DELETE" method="post">
<button class="btn btn-sm btn-danger" type="submit">Delete</button>
</form>
</td>
</tr>`;
console.log(response);
$(".category-list").append(html);
}
});
$("#category-title").val('');
});
非常感谢您的帮助!
【问题讨论】:
标签: ajax handlebars.js express-handlebars