Intereting Posts

在AJAX调用(使用ExpressJS)之后,通过EJS模板中的数组循环的正确方法是什么?

所以我试图循环通过一个http调用使用request模块/包使用我的内部API的对象数组。 到目前为止,我能够从API中获取数据,并在页面上显示完整的对象。 我想将其显示在我的页面上,并使用EJS模板系统进行循环。 我知道我可以使用AngularJS作为前端的东西,但我想看看我只能在服务器端使用多远。

所以下面是我的代码:

server.js

 // Prepend /api to my apiRoutes app.use('/api', require('./app/api')); 

api.js

 var Report = require('./models/report'); var express = require('express'); var apiRoutes = express.Router(); apiRoutes.route('/reports', isLoggedIn) .get(function (req, res,next) { // use mongoose to get all reports in the database Report.find(function (err, reports) { // if there is an error retrieving, send the error. // nothing after res.send(err) will execute if (err) return res.send(err); res.json(reports); }); }); 

routes.js

 var User = require('./models/user'); var request = require('request'); module.exports = function (app, passport) { app.get('/reports', isLoggedIn, function (req, res) { res.render('pages/new-report.ejs', { user: req.user, title:'New Report' }); }); request({ uri:'http://localhost:2016/api/reports', method:'GET' }).on('data',function(data){ console.log('decoded chunk:' + data) }).on('response',function(resp){ resp.on('data', function(data){ console.log('received:' + data.length + ' bytes of compressed data'); app.get('/timeline', isLoggedIn, function (req, res) { res.render('pages/timeline', { user: req.user, title:'Timeline', reports: data }); }); }) }); } 

reports.ejs
所以,如果我只是简单地输出整个reports对象,像我的网页上的<p><%= reports %></p> ,一切工作正常,我得到这样的东西:

 [ { "_id": "5775d396077082280df0fbb1", "author": "57582911a2761f9c77f15528", "dateTime": "30 June 2016 - 07:18 PM", "picture": "", "description": "", "location": [ -122.46596999999997, 37.784495 ], "latitude": 37.784495, "longitude": -122.46596999999997, "address": "4529 California St, San Francisco, CA 94118, USA", "contact": "John Doe", "type": "Financial", "__v": 0, "updated_at": "2016-07-01T02:21:10.259Z", "created_at": "2016-07-01T02:21:10.237Z", "tags": [ "tag1,tag2" ] } ] 

但是,如果我试图通过下面看到的对象循环它得到一个UNDEFINED作为我的报告对象的返回属性,我显然得到一个无限循环。

 <ul class="timeline"> <% reports.forEach(function(report) { %> <li class="timeline-yellow"> <div class="timeline-time"> <span class="date" style="text-align:left"> <%= report.type %> </span> <span class="time" style="font-weight:700;font-size:25px;line-height:20px;text-align:left;"> <%= report.dateTime %> </span> </div> </li> <% }) %> </ul> 

我已经尝试了循环的另一个变体,但我仍然不成功:

 <ul class="timeline"> <% for (var i = 0; i < reports.length; i++) { %> <li class="timeline-yellow"> <div class="timeline-time"> <span class="date" style="text-align:left"> <%= report[i].type %> 4/10/13 </span> <span class="time" style="font-weight:700;font-size:25px;line-height:20px;text-align:left;"> <%= report[i].dateTime %> </span> </div> </li> <% } %> </ul> 

Solutions Collecting From Web of "在AJAX调用(使用ExpressJS)之后,通过EJS模板中的数组循环的正确方法是什么?"

ejs for循环的语法是完美的,但迭代的数组名称是报告,并且您似乎在迭代中使用了report [i] ,需要将其更改为报告[i] ,该报告应该可以工作。

reports.ejs

 <ul class="timeline"> <% for (var i = 0; i < reports.length; i++) { %> <li class="timeline-yellow"> <div class="timeline-time"> <span class="date" style="text-align:left"> <%= reports[i].type %> 4/10/13 </span> <span class="time" style="font-weight:700;font-size:25px;line-height:20px;text-align:left;"> <%= reports[i].dateTime %> </span> </div> </li> <% } %> </ul> 

希望这可以帮助。

Async是一个实用程序模块,它为asynchronousJavaScript提供了直接,强大的function。 虽然最初devise用于Node.js和可安装通过

npm install --save async

有关文档,请访问http://caolan.github.io/async/

例子

 // assuming openFiles is an array of file names and saveFile is a function // to save the modified contents of that file: async.each(openFiles, saveFile, function(err){ // if any of the saves produced an error, err would equal that error }); // assuming openFiles is an array of file names async.each(openFiles, function(file, callback) { // Perform operation on file here. console.log('Processing file ' + file); if( file.length > 32 ) { console.log('This file name is too long'); callback('File name too long'); } else { // Do work to process file here console.log('File processed'); callback(); } }, function(err){ // if any of the file processing produced an error, err would equal that error if( err ) { // One of the iterations produced an error. // All processing will now stop. console.log('A file failed to process'); } else { console.log('All files have been processed successfully'); } });