Jade.js tables and variables

I'm having issues where I can easily create a table in Jade if I use a variable that I've defined on the page, but as soon as I try to use anything else it prints a long table of nothing.

For instance I can produce a table with the below code:

table
  thead
    tr
      th Bid ID
      th Bid Value
  tbody
    items = [ {"bid_id":1, "bid_value":1.63},{"bid_id":2, "bid_value":1.75},{"bid_id":3, "bid_value":1.00} ]
    each item, i in items
      tr
        td #{item.bid_id}
        td #{item.bid_value}

However when I try to use the following I get a very long table that's completely empty!

table
  thead
    tr
      th Bid ID
      th Bid Value
  tbody
    items = all_bids
    each item, i in items
      tr
        td #{item.bid_id}
        td #{item.bid_value}

all_bids contains the exact same JSON as defined explicitly above. If I print it in the Jade view using:

p= all_bids

It prints the array correctly as:

[ {"bid_id":1, "bid_value":1.63},{"bid_id":2, "bid_value":1.75},{"bid_id":3, "bid_value":1.00} ]

Struggling to find any decent documentation on creating tables in Jade so any help would be appreciated!

Thanks!

So... is all_bids an array or maybe it is a json string?? It seems that all_bids is a string in your case. In this case each loops over characters and since characters do not have neither bid_id nor bid_value property you obtain a big and empty table.

Now how did I come up with this stuff?? Let's try to be detectives for a moment, shall we? :) Look at this line: p= all_bids. It produces this output:

[ {"bid_id":1, "bid_value":1.63},{"bid_id":2, "bid_value":1.75},{"bid_id":3, "bid_value":1.00} ]

Normally if it was an array you would get:

"[object Object],[object Object],[object Object]"

because of .toString() call (which happens behind the scene). Therefore all_bids is not an array, it's a string!

When you pass all_bids to Jade, try converting it into an object, i.e. JSON.parse(all_bids);.