Пройтись циклом в теле шаблонной строки

436

29 июня 2017, 05:13

Привет. Можно ли пройтись циклом по массиву внутри шаблонной строки? Например, есть массив:

"carriers": [
  0: "S7",
  1: "SU"
]

Который я хочу вывести, например, в строку:

element.append(`
    <h2>Carriers:</h2>
    <div class="carriers">
        <img src="/img/carriers/S7.png" />
        <img src="/img/carriers/SU.png" />
    </div>
`);

И, да, меня интересует решение конкретно в теле append()(специфика задачи).

Answer 1

Если очень хочется, то можно вот так:

const carriers = ["S7", "SU"];
element.append(`
    <div class="carriers">
        ${carriers.map(name => '<img src="/img/carriers/' + name + '.png" />').join('')}
    </div>
`);

Но лучше так никогда-никогда не делать. Вместо этого возьмите любой JS шаблонизатор и используйте его.