How to pull data from JSON to PUG using a loop?

Question

JavaScript

I still don't fully understand how to use the loop in pug.
I have JSON:

"nav": [
    {
      "link": {
        "title": "banana",
        "href": "/banana"
      }
    },
    {
      "link": {
        "title": "tomato",
        "href": "/tomato"
      }
    },
    {
      "link": {
        "title": "mango",
        "href": "/mango"
      }
    }
  ]

I wanted something like this to work.

ul
    each entry in nav.link
      li: a(href= entry.href)= entry.title

if it is possible of course.
maybe I wrote something utter, but how much I googled - I did not figure it out.

Answer 1

I still don't fully understand how to use the loop in pug.

It's not pug, it's a misunderstanding of javascript objects and arrays.

-
  const data = {
    "nav": [
      {
        "link": {
          "title": "banana",
          "href": "/banana"
        }
      },
      {
        "link": {
          "title": "tomato",
          "href": "/tomato"
        }
      },
      {
        "link": {
          "title": "mango",
          "href": "/mango"
        }
      }
    ]
  };

each item in data.nav
  li: a(href=item.link.href) !{item.link.title}

Answer 2

https://pugjs.org/language/iteration.html
The very first example