Два html-класса с переменными twig

Я хочу иметь элемент html с двумя классами, определяемыми переменными ветки. Я могу сделать это с одной переменной веточки, и они оба работают отдельно. Но как только я пытаюсь собрать их вместе, эффективен только первый урок. Я искал на форуме, но нашел только классы веточки или два класса прямо в html. С Twig у меня есть:

<p class = {{"type#{item.type1}"}}> Paragraph </p>

В html должно быть:

<p class = "type1 type2"}}

Когда я пытаюсь объединить оба, как показано ниже, это не работает:

<p class = {{"type#{item.type1} type#{item.type2}"}} > Paragraph </p>

Я также пробовал другой метод concat с ~, но безуспешно. Как объединить строки в twig

И вместо места я попытался добавить &nbsp;, как описано здесь, также безуспешно: Как добавить пробел между переменными в шаблоне веточки?

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...
1
0
1 308
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы забыли заключить значение атрибута в кавычки. HTML будет рассматривать второй класс как другой атрибут, не являющийся частью атрибута класса.

<p class = "{{"type#{item.type1} type#{item.type2}"}}">Paragraph</p>

Спасибо ! Это сработало. Я думал, что кавычки, содержащиеся в {{}}, заключают атрибут в оболочку.

Shaker81 09.09.2018 17:17

Нет, потому что twig будет рассматривать их как начало и конец строки, например, {{ "foo" }} будет выводить foo

DarkBee 09.09.2018 17:29

Другие вопросы по теме