Как использовать цикл для создания Bootstrap в Pug? - PullRequest
Новая
       42

Как использовать цикл для создания Bootstrap в Pug?

0 голосов
/ 15 февраля 2019

Вот мой код 

div
    ul.nav.nav-tabs(role='tablist')
            //- li.active(role='presentation')
            //-     a(href='#session1', aria-controls='session1', role='tab', data-toggle='tab') Session 1
            //- li(role='presentation')
            //-     a(href='#session2', aria-controls='session2', role='tab', data-toggle='tab') Session 2
            //- li(role='presentation')
            //-     a(href='#session3', aria-controls='session3', role='tab', data-toggle='tab') Session 3
            //- li(role='presentation')
            //-     a(href='#session4', aria-controls='session4', role='tab', data-toggle='tab') Session 4
            each num in !{sessionsNumber}
                li(role='presentation')
                    a(href='#session' + num, aria-controls='session' + num, role='tab', data-toggle='tab') Session #{num};
    .tab-content
            #session1.tab-pane.active(role='tabpanel')
                table#myTable1.table.table-striped.table-bordered(cellspacing="0" width="100%")
            #session2.tab-pane(role='tabpanel')
                table#myTable2.table.table-striped.table-bordered(cellspacing="0" width="100%")
            #session3.tab-pane(role='tabpanel')
                table#myTable3.table.table-striped.table-bordered(cellspacing="0" width="100%")
            #session4.tab-pane(role='tabpanel')
                table#myTable4.table.table-striped.table-bordered(cellspacing="0" width="100%")

Часть, которую я закомментировал, работала как ожидалось.Но я хочу изменить это на петлю.! {SessionNumber} - это то, что я визуализирую в экспресс-бэкенде. 

 res.render('schedule', { sessionsNumber: JSON.stringify([1,2,3,4])})

У меня есть console.log! {SessionNumber} в одном из тегов сценария с document.reay, и он отображается в виде массивакак и ожидалось.Я просто не уверен, почему это не работает, когда я изменил его на каждый цикл.Я также проверил страницу, и под тегом ul нет html-компонента.

Любая помощь будет полезна!

1 Ответ

0 голосов
/ 15 февраля 2019

res.render('schedule', { sessionsNumber: JSON.stringify([1,2,3,4])}) отправляет массив в виде строки в представление, потому что вы json.stringifying.Это не обязательно.Вместо этого попробуйте отправить массив следующим образом: res.render('schedule', { sessionsNumber: [1,2,3,4]}), а затем повторите его с 

each num in sessionsNumber
 li(role='presentation')
   a(href='#session' + num, aria-controls='session' + num, role='tab', data-toggle='tab') Session #{num}
.
...