สวัสดี ฉันค่อนข้างใหม่กับ Node, express และ pug ฉันกำลังพยายามแสดงวัตถุในมุมมอง และฉันได้รับข้อผิดพลาด pug หรืออย่างน้อยฉันคิดว่ามันเป็นข้อผิดพลาดของ pug ฉันใช้ pugcli และเมื่อมันพยายามแสดง html ฉันพบข้อผิดพลาด
ข้อผิดพลาด pugcli ปรากฏบนเทอร์มินัลเป็น:
ไม่สามารถอ่านคุณสมบัติ 'ความยาว' ของไม่ได้กำหนดได้
สิ่งนี้แปลกเพราะเมื่อฉันพยายามดูในเบราว์เซอร์ แม้ว่า pug cli จะแสดงข้อผิดพลาด แต่เบราว์เซอร์แสดงรายการ แต่มีองค์ประกอบ <li>
ทั้งหมดว่างเปล่า
ฉันต้องการให้ <li>
แสดงรหัสวัตถุ ชื่อ และอายุ
ฉันเข้าใจว่าใน pug เพื่อเรนเดอร์วัตถุคุณต้องวนซ้ำโดยใช้ for loop บางอย่าง ฉันได้เขียนสิ่งนั้นในไฟล์ pug แต่วัตถุไม่แสดงผล
ฉันขอขอบคุณสำหรับความช่วยเหลือเกี่ยวกับสิ่งที่ฉันขาดหายไปในโค้ดหรือถ้าฉันทำให้โค้ดเสียหายโดยสิ้นเชิง
การตั้งค่าของฉันมีดังนี้
bin/www public javascripts stylesheets routes index.js views index.pug layout.pug ... app.js
index.pug ของฉันคือ:
extends layout
block content
h1= title
p Welcome to #{appHeading}
div
ul
for user, i in users
li= users.name +" - "+ users.id
li=number
นี่คือ index.js ของฉันคือ:
var express = require('express');
var router = express.Router();
var users = [
{
id: 0,
name: 'Glenn',
age: 40
},
{
id: 1,
name: 'Jeff',
age: 37
},
{
id: 2,
name: 'Sara',
age: 22
},
{
id: 3,
name: 'Bill',
age: 41
},
{
id: 4,
name: 'Mary',
age: 29
},
];
var appHeading = 'my object render app '
var number = 42;
/* GET home page. */
router.get('/', function(req, res, next) {
//res.json(users);
//res.send('Is this working?')
res.render('index', {
title: 'This is my app to render objects in pug',
users,
number,
appHeading
});
});
module.exports = router;
และ app.js ของฉันคือ:
const createError = require('http-errors');
const express = require('express');
const path = require('path');
const cookieParser = require('cookie-parser');
const logger = require('morgan');
const bodyParser = require('body-parser');
const indexRouter = require('./routes/index.js');
const usersRouter = require('./routes/users.js');
const app = express();
/*const logging = function(req, res, next){
console.log('Logging....')
next();
}
*/
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');
app.use(logger('dev'));
//Body Parser middleware
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended : false}));
//app.use(express.json());
//app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
//app.use(logging);
app.use('/', indexRouter);
app.use('/users', usersRouter);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
next(createError(404));
});
// error handler
app.use(function(err, req, res, next) {
// set locals, only providing error in development
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {};
// render the error page
res.status(err.status || 500);
res.render('error');
});
app.listen(port=3000 , function(){
console.log('Server started on port '+ port);
})
module.exports = app;
!{JSON.stringify(users)}
ลงในเทมเพลตของคุณ - person Juan D. Gómez   schedule 15.11.2018!{JSON.stringify(users)}
ลงในไฟล์ pug และเกิดข้อผิดพลาดในการเรนเดอร์หรือเพจ มันไม่ชอบโค้ดนั้นในไฟล์ pug ฉันลองในไฟล์ js แล้ว แต่ก็ไม่ได้ทำอะไรเลย ฉันเล่นกับ ti ต่อไป และมันเปลี่ยนวัตถุให้เป็นสตริง ฉันไม่สามารถโทรหาบางอย่างเช่นusers.id
และรับรหัสได้อีกต่อไป มันกลายเป็นสตริงที่สมบูรณ์ซึ่งฉันจะต้องแยกวิเคราะห์อย่างสมบูรณ์ นี่จะไม่ทำงาน ฉันขอขอบคุณความช่วยเหลืออื่น ๆ - person digitalguru   schedule 15.11.2018for user, i in users
ฉันขอขอบคุณความช่วยเหลือใด ๆ - person digitalguru   schedule 15.11.2018!{JSON.stringify(users)}
คือการดีบั๊กและตรวจสอบว่าอาร์เรย์ผู้ใช้ถูกส่งผ่านอย่างถูกต้อง ดังนั้น คุณไม่จำเป็นต้องเก็บโค้ดนี้ไว้ในเทมเพลต เพียงตรวจสอบว่าค่าถูกต้องแล้วจึงลบออก - person Juan D. Gómez   schedule 15.11.2018users
เทียบกับuser
) - person Graham   schedule 15.11.2018