Как да добавите активен клас към навигационна връзка чрез Pug или JS

Не мога да получа активен клас за моите навигационни връзки въз основа на това кой URL адрес е активен в момента.

Имах ментор, който ми помогна да напиша този код и той работеше:

if filename.replace('.pug', '.html').indexOf(pageLink) > 0
 a.active-nav-link= pageName
else
 a(href=pageLink)= pageName

но се върнах към проекта и сега има грешка при компилиране с кода и когато променя блока само на a(href=pageLink)= pageName, той се компилира успешно, но класът .active-nav-link очевидно го няма.

ul.reveal
 each pageLink, pageName in navLink
  li
   block pages
     a(href=pageLink)= pageName

Как да накарам класа .active-nav-link да се приложи към текущата страница, както беше преди. Може би кодът по-горе е остарял и трябва да бъде променен. Готов съм да опитам други прости подходи, тъй като не съм много напреднал.


javascript pug
person Michael Lawinger    schedule 25.04.2019    source източник
comment
Споменахте грешка на компилатора. Моля, кажете ни какво пише.   -  person Benjamin Davies    schedule 25.04.2019
comment
@JackBashford, но се върнах към проекта и има грешка при компилиране...   -  person Benjamin Davies    schedule 25.04.2019
comment
Трябваше да добавя, че използвам Prepros за компилиране и грешката, която получавам, е Не мога да прочета „замяна“ на недефинирано. Така че имате ли представа дали може да е моят компилатор или тяхната промяна, която можем да направим в кода?   -  person Michael Lawinger    schedule 25.04.2019

Отговори (1)


arrow_upward
1
arrow_downward

Можете да използвате JS изрази като стойности на атрибути в pug. Опитайте тази:

a(
    href=pageLink
    class=(filename.replace('.pug', '.html').indexOf(pageLink) > 0 ? 'active-nav-link' : '')
)= pageName
person Emilio Venegas    schedule 25.04.2019
comment
Опитах кода, но моят компилатор дава горното съобщение за грешка от моя компилатор. - person Michael Lawinger; 25.04.2019
comment
Тествах кода и нямах проблеми, така че звучи като проблем с вашия компилатор, а не с pug. Опитайте да потърсите грешката, която получавате в google или в GitHub repo на компилатора, който използвате. - person Emilio Venegas; 26.04.2019
comment
Добре. Ще прегледам документацията, благодаря за помощта! - person Michael Lawinger; 26.04.2019
comment
Благодаря ви, момчета, кодът работи, току-що смених компилаторите и той се компилира без проблем. Благодаря отново, опитвам се да изгладя този проблем от няколко седмици! - person Michael Lawinger; 29.04.2019