在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>
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'); } });