How to iterate over a map in pug

Issue

I have a map that I am passing to pug on my server but I am unable to iterate over the key value pairs in the map in order to render the data in the map. I have tried simplifying the map down but still can’t get it to work.

router.get('url', middlware(),(req,res)=>{
  let renderData = {};
  renderData.test = new Map([["1","one"],["2","two"]]);
  res.render('template', renderData);
})

template:

block content
  .container
    .mt-3.whiteBG
      each item in test
        p here is some text

In the simplified version I can’t even get plain text to render, let alone access the values of the map within the iteration. I am able to access the values if I do something like this p #{test.get("1")}
Are maps just not iterable in Pug? If not is there a way for me to convert my map into an array/object that Pug can iterate through?

Solution

Pug will support iteration over ES6 collections in the next release. Until then, you can convert the Map to an object using Object.fromEntries():

renderData.test = Object.fromEntries(renderData.test);

Answered By – Leftium

Answer Checked By – Katrina (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.