Шаблоны Jade - Динамические атрибуты

Я хочу создавать атрибуты "на лету" для некоторых элементов html.

В моем случае я хотел бы установить (или нет) отключенный атрибут в соответствии с user.role.

Итак, если user имеет разрешение на редактирование некоторого поля, я не хочу помещать атрибут disabled в элемент. В противном случае я этого хочу.

Я знаю, что могу сделать это с помощью этих подходов:

- Подход 1 - Использование условных обозначений

if (user.role === 1)
   input(type='text', name='foo')
else
   input(type='text', name='foo', disabled)

- Подход 2 - Обычный HTML

- var disabledAttr = (user.role === 1) ? "disabled" : "";
| <input type="text" name="foo" #{ disabledAttr} />

Подход 1 плохой, потому что мне нужно повторить некоторый код. С Approach 2 мне не нужно повторять код, но я должен использовать простой HTML вместо разметки Jade.

Я пробовал что-то вроде этого:

input(type='text', name='foo', #{ disabledAttr} )

Но jade генерирует следующий код:

<input type="text" name="foo" disabledattr="" />

Любая лучшая идея?

Ответ 1

Джейд довольно умный, когда ему нужно выяснить, как визуализировать атрибуты. Вы можете отобразить отключенный атрибут, используя эту единственную строку нефритовой разметки

input(type='text', name='foo', disabled=role!==1)

Ответ 2

Вы можете использовать кучу атрибутов условным образом:

input(type='text')&attributes(user.role === 1 ? {'disabled': 'true'} : {'class': 'admin', 'ng-model': 'vm.model.name', 'ng-click': 'vm.click()'})

Ответ 3

Этот синтаксис работает для меня:

input(placeholder!="<%= translate('Add new item') %>")

где translate - это функция, которая возвращает переведенный текст.