Menu on jade, how to make it up?

Question

Pug

- var categories = ["Мобильные телефоны","Планшеты","Навигаторы"]
- var categoricons = ['img/categories/icon1.png','img/categories/icon2.png','img/categories/icon3.png']
                 
  ul.categories
    each item in categories
    
    
      li.categories__item
        a(href="").categories__link
          span.categories__icon
            each item in categoricons                        
              img(src= "#{item}")
          span.categories__text= item
       .categories__count 85

Compiles:

<ul class="categories">
  <li class="categories__item"><a href="" class="categories__link"><span class="categories__icon"><img src="img/categories/icon1.png"/><img src="img/categories/icon2.png"/><img src="img/categories/icon3.png"/></span><span class="categories__text">Мобильные телефоны</span></a></li>
  <div class="categories__count">85</div>
  <li class="categories__item"><a href="" class="categories__link"><span class="categories__icon"><img src="img/categories/icon1.png"/><img src="img/categories/icon2.png"/><img src="img/categories/icon3.png"/></span><span class="categories__text">Планшеты</span></a></li>
  <div class="categories__count">85</div>
  <li class="categories__item"><a href="" class="categories__link"><span class="categories__icon"><img src="img/categories/icon1.png"/><img src="img/categories/icon2.png"/><img src="img/categories/icon3.png"/></span><span class="categories__text">Навигаторы</span></a></li>
  <div class="categories__count">85</div>
</ul>

And you need:

<ul class="categories">
  <li class="categories__item"><a href="" class="categories__link"><span class="categories__icon"><img src="img/categories/icon1.png"/></span><span class="categories__text">Мобильные телефоны</span></a></li>
  <div class="categories__count">85</div>
  <li class="categories__item"><a href="" class="categories__link"><span class="categories__icon"><img src="img/categories/icon2.png"/></span><span class="categories__text">Планшеты</span></a></li>
  <div class="categories__count">85</div>
  <li class="categories__item"><a href="" class="categories__link"><span class="categories__icon"><img src="img/categories/icon3.png"/></span><span class="categories__text">Навигаторы</span></a></li>
  <div class="categories__count">85</div>
</ul>

Help, who knows, please =)

Answer 1

There is in the documentation :

each item, index in categories
    // ...
    img(src= "#{categoricons[index]}")

The nested loop is not needed.