2016-01-10 7 views
1

Я использую layout taglib до . Протяните страницу к ее шаблону, но я не знаю, как передать переменную в основной макет и применить условный класс.Условный класс в шаблоне Marko JS

Учитывая это мой main-layout.marko

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    </head> 
    <body class="#### (TITLE === 'REGISTER')?'ACTIVE':'INACTIVE' ####"> 
    <layout-placeholder name="title"/> 
    <layout-placeholder name="body"/> 
    </body> 
</html> 

это мой registration.marko

<layout-use template="./layout.marko"> 
    <layout-put into="title"> 
     $data.title 
    </layout-put> 
    <layout-put into="body"> 
     some content 
    </layout-put> 
</layout-use> 

и, наконец, это код, который я использую для отображения страницы и передать данные заголовка

router.get('/register', function(req, res, next) { 
    registration.render({ 
    title: 'register' 
    }, res); 
}); 

Как создать условный класс на main-layout.marko, который переключается между активным или inactive в зависимости от названия страницы?

Благодаря

ответ

3

Вы можете передать данные в макете, добавив дополнительные атрибуты в <layout-use> тега. См: marko-layout » Layout Data

Для примера, следующие будут работать:

В main-layout.marko:

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    </head> 
    <body class="#### ${data.title === 'REGISTER' ? 'ACTIVE' : 'INACTIVE' } ####"> 
    <layout-placeholder name="title"> 
     ${data.title} 
    </layout-placeholder> 
    <layout-placeholder name="body"/> 
    </body> 
</html> 

В registration.marko:

<layout-use template="./layout.marko" title="${data.title}"> 
    <layout-put into="body"> 
     some content 
    </layout-put> 
</layout-use> 

Это должно решить вашу проблему, но дайте мне знать если вы все еще застряли.

+0

Это, безусловно, работает спасибо! В чем разница между тернарным условием, которое вы написали, и этим? {? Data.title === 'register'; active; inactive} '? – crash

+0

Хороший вопрос, @crash. Они сводятся к одному и тому же, поэтому это только синтаксическая разница. См.: Http://markojs.com/try-online/#Conditionals_Shorthand_Conditionals При использовании '{? ...} ', альтернативное предложение является необязательным, в отличие от терминологического условия JavaScript. В следующей крупной версии Marko мы планируем отказаться от поддержки пользовательского Marko '{? ...} ', чтобы упростить язык и быть ближе к JavaScript. В Marko v3 значение атрибута всегда будет действительным выражением JavaScript. См. Https://github.com/marko-js/marko/issues/90 –

-1

есть другой способ передачи данных t всего его шаблона, который использует $ global, в котором вы передаете свои данные.

и после использования глобального вам не нужно добавлять атрибут к любому тегу. вы можете получить к нему доступ, используя out.global.username

Смежные вопросы