La mezcla de Jade utilizada en el bucle "cada"/"para" da JS_Parse_Error

Título: Jade mixin used in "each"/"for" loop gives JS_Parse_Error

Pregunta: What is the root cause of -and fix for- the error being thrown by this code?

Objetivo: Use Jade's 'mixin' capability with its 'each' iteration construct to populate the view with data stored in an array.

Antecedentes: Assuming the issue is with syntax for iteration, I've tried many permutations ('each'|'for'; commas|no commas; (placeholder|expression) interpolation, escaped|unescaped; varying the whitespace)... and even prayer. I am all out of ideas.

Código:

The Jade view (file named "mixin_with_args.jade" placed in $APP_ROOT/views/):

heroes = [
  {name: 'Fooman', role: 'captain'},
  {name: 'Barman', role: 'entertainer'},
  {name: 'Napman', role: 'hacker'},
  {name: 'Zipman', role: 'collector'}
]

mixin heroes_list(hero)
  if hero.role == 'captain'
    li Captain #{hero.name}
  else
    li #{hero.name}

ul
  each hero in heroes
    +heroes_list(hero)

The express.js server "app.js" (placed in $APP_ROOT):

var express = require('express');
var routes = require('./routes');
var user = require('./routes/user');
var http = require('http');
var path = require('path');

var app = express();

// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', __dirname + '/views');
app.set('view engine', 'jade');
app.use(express.favicon());
app.use(express.logger({ format: ':remote-addr :method :url' }));
app.use(express.bodyParser());
app.use(express.static('./public'));
app.use(app.router);

app.locals.pretty = true;
app.use(express.errorHandler({ dumpExceptions: true , showStack: true }));

app.get('/', function(req, res) {
  res.render('mixin_with_args', {
  });
});

http.createServer(app).listen(app.get('port'), function(){
  console.log('Express server listening on port ' + app.get('port'));
});

Error message and stack trace are:

500 Unexpected token: punc ()) (line: 4, col: 15, pos: 185) 
Error at new JS_Parse_Error (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:196:18) 
at js_error (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:204:11) 
at croak (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:636:9) 
at token_error (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:644:9) 
at unexpected (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:650:9) 
at expr_atom (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:1119:13) 
at maybe_unary (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:1287:19) 
at expr_ops (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:1322:24) 
at maybe_conditional (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:1327:20) 
at maybe_assign (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:1351:20)
at new JS_Parse_Error (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:196:18)
at js_error (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:204:11)
at croak (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:636:9)
at token_error (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:644:9)
at unexpected (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:650:9)
at expr_atom (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:1119:13)
at maybe_unary (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:1287:19)
at expr_ops (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:1322:24)
at maybe_conditional (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:1327:20)
at maybe_assign (/Users/lucky/myapp/node_modules/jade/node_modules/with/node_modules/uglify-js/lib/parse.js:1351:20)

preguntado el 09 de septiembre de 13 a las 23:09

1 Respuestas

Hope this will help you some. Your problem isn't with how you are iterating through the loop. That works well. The problem you're dealing with is how you are declaring your variable array.

You should declare it in a single line like so:

heroes = [{name: 'Fooman', role: 'captain'}, {name: 'Barman', role: 'entertainer'},{name: 'Napman', role: 'hacker'},{name: 'Zipman', role: 'collector'}]

mixin heroes_list(hero)
  if hero.role == 'captain'
    li Captain #{hero.name}
  else
    li #{hero.name}

ul
  each hero in heroes
    +heroes_list(hero)

Mira esto: https://github.com/visionmedia/jade/issues/502

If that is not appealing solution to you, then you could declare your array in your app.js and pass it through the render.

app.get('/', function(req, res) {
  var heroes = [
    {name:"Fooman", role: "captain"},
    {name:"Barman", role: "entertainer"}
  ];
  res.render('mixin_with_args', {heroes: heroes});
});

Respondido el 13 de Septiembre de 13 a las 15:09

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.