Как заставить Jade останавливать атрибуты элементов HTML-кодировки и выдавать буквальное строковое значение?

Question

UPDATE Jade v0.24.0 исправляет это с помощью синтаксиса != для атрибутов. option(value!='<%= id %>')

---

Я пытаюсь построить <option> с нефритом, где стоимость опциона является UnderscoreJS шаблон маркера: <%= id %>, но я не могу заставить его работать, потому что нефрит преобразования мой маркер текста в <= id > ,

Вот мой Джейд разметки:

script(id="my-template", type="text/template") 
    select(id="type") 
    <% _.each(deviceTypes, function(type){ %> 
    option(value='&lt;%= type.id %>') <%= type.name %> 
    &lt;% }) %> 

Я ожидаю, что производить этот HTML:

<script id="my-template" type="text/template"> 
    <select id='type'> 
    <% _.each(deviceTypes, function(type){ %> 
    <option value="<%= type.id %>"> <%= type.name %> </option> 
    <% }) %> 
    </select> 
</script> 

Но что я получаю вместо этого, это:

<script id="my-template" type="text/template"> 
    <select id='type'> 
    <% _.each(deviceTypes, function(type){ %> 
    <option value="&lt;%= type.id %&gt;"> <%= type.name %> </option> 
    <% }) %> 
    </select> 
</script> 

Обратите внимание на очень тонкая разница в линии вывода <option> ... атрибут tон был закодирован в HTML.

Как предотвратить Jade от HTML, кодирующего это значение? Мне нужно, чтобы оно выдавало буквальное значение, так же, как и с текстом опции.

Answer 1

На данный момент я не верю, что есть способ. См. Этот вопрос: https://github.com/visionmedia/jade/issues/198

Я закончил тем, что отказался от необработанного HTML, чтобы решить эту проблему, используя | префикс.

Answer 2

Derick уже упомянул, что Jade добавил новую функцию для unescape HTML-кодирования в обновлении, но я хотел бы добавить некоторое дополнение для тех, кто может не распознать.

- var html = "<script></script>" 
| !{html} <-- Escaped 
| #{html} <-- Encoded 

https://github.com/visionmedia/jade из

Answer 3

Эта функция была added to Jade. Вы просто использовать оператор != если вы хотите экранирования в значения атрибутов:

script#my-template(type='text/template') 
    a(href!='<%= url =>') Clicky clicky... 

Answer 4

Так у меня был вопрос, подобный этому, где я хотел, чтобы создать шаблон Underscore внутри одной из моих взглядов Джейд. Часть шаблона Underscore должна была установить атрибут selected в теге <option>.

Первоначально я пробовал иметь подменю «выбранный» или «». К сожалению, Jade doesn't have a way to display an attribute with no value и не имеет способа присвоения имен без экранирования (биты Underscore возвращались без кавычек).

К счастью, вы можете отменить значение атрибута, сохраняя кавычки.

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

- var checkType = function(type) { return "<%= contact.type == '" + type + "' %>" }; 

.clearfix 
    label Title: 
    .input 
    select(type="text", name="contact[title]", class="new-title") 
     option(value="") Choose Title 
     option(value="manager", selected="#{ checkType('manager') }") Manager 
     option(value="member", selected="#{ checkType('member') }") Member 
     option(value="owner", selected="#{ checkType('owner') }") Owner 
     option(value="president", selected="#{ checkType('president') }") President 
     option(value="individual", selected="#{ checkType('individual') }") Individual 
     option(value="main_contact", selected="#{ checkType('main_contact') }") Main Contact 

По некоторым данным, вы должны быть в состоянии использовать !{} здесь, чтобы полностью избежать все кодировки (<, >, etc.), однако это не работает на моей версии Джейд. Я использую "^0.30", а текущая версия - 1.x.

Если кто-то может подтвердить, что !{} действительно работает в этой ситуации, используя последнюю версию Jade, я обновлю свой ответ.