Node.js rendering variables in Jade

Question

I want to view all the URL's in my view, but I get #{data.id} Cannot read property 'id' of undefined error.

I want to create a loop and view all the videos I have.

app.js

app.get('/you', function(req,res) {
    youtube.where('id', '<', '5689').fetchAll().then(function(data) {
        res.render('youtube', {
            mi : data
        });
    });
});

Here's an example output for a given ID (I changed res.render to res.send to test my query, so it works)

[
    {
        "id": 442,
        "channel_name": "channelNameredacted",
        "video_url": "videoURlRedacted",
        "video_title": "redacted",
        "status": 1,
        "date": "redacted"
    }
]

youtube.jade

Let's say I want to output video ID's.

html
  head
  body
    each data in mi
      #{data.id}

The only way I can see this error occurring with that view is if the data provided by youtube includes an undefined element in the collection – [ { id: 442 }, undefined ]. If you add the condition if data under the each, does it succeed then? — Jonathan Lonowski
– Jonathan Lonowski, Commented Nov 18, 2015 at 5:03
Side-note: Using #{...} at the start of a line renders a dynamically-named element – <442></442>. I'm guessing that's probably not what you were going for. To render data.id as text, add an element or a pipe before it – div #{data.id} or | #{data.id}. — Jonathan Lonowski
– Jonathan Lonowski, Commented Nov 18, 2015 at 5:04

vinayr · Accepted Answer · 2015-11-18 05:09:53Z

1

This works for me -

var jade = require('jade'),
  fs = require('fs');

var data = {
  mi: [
    {
      "id": 442,
      "channel_name": "channelNameredacted",
      "video_url": "videoURlRedacted",
      "video_title": "redacted",
      "status": 1,
      "date": "redacted"
    }
  ]
};

fs.readFile('youtube.jade', 'utf-8', function(error, source){
  var html = jade.render(source, data);
  console.log(html)
});

youtube.jade

html
  head
  body
    ul
      each data in mi
        li= data.id

output

<html><head></head><body><ul><li>442</li></ul></body></html>

answered Nov 18, 2015 at 5:09

vinayr

11.3k3 gold badges49 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

salep · Accepted Answer · 2015-11-18 16:53:15Z

0

I solved it like this.

app.get('/ind', function(req,res) {
    youtube.where('id', '<', '100').fetchAll().then(function(data) {
        data = data.toJSON();
        res.render('youtube', {
            mi : data
        });
    });
});

youtube.jade

html
  head
  body
    ul
      for m in mi
        li #{m.id}

answered Nov 18, 2015 at 16:53

salep

1,3929 gold badges46 silver badges95 bronze badges

Collectives™ on Stack Overflow

Node.js rendering variables in Jade

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related