¿Cómo puedo escapar de las llaves dentro de las plantillas de jade?

Question

¿Cómo puedo escapar de las llaves dentro de una teplato de jade? (uso jade dentro de node.js)

Quiero presentar plantillas de jQuery al cliente. La parte quiero escapar se parece a esto:

div(class='clear') 
script(id='BoardListTemplate', type='text/x-jQuery-tmpl') 
    <p>${Title}</p> 
    <ul id="${Id}" class="IterationBoardList"> 
    <li class="AddNewItem">Add new Item</li> 
    {{tmpl(Items) "#BoardListItemTemplate"}} 
    </ul> 
script(id='BoardListItemTemplate', type='text/x-jQuery-tmpl') 
    <li class="Item" id="${{$data.Id}}"> 
    ${$data.Description}<br /> 
    Assigned to: ${$data.AssignedTo}<br/> 
    StoryPoints: ${$data.StoryPoints}</li> 
script(src='/javascripts/Scrummr.Engine.js', id='BoardListItemTemplate', type='text/javascript') 

muchas gracias

Answer 1

Tienes que usar la barra vertical (|) delante de cada línea dentro del bloque de script.

Vea https://gist.github.com/2047079 para ver un ejemplo.

Answer 2

Hay dos cosas diferentes pasando aquí.

Jade utiliza espacios en blanco para implicar la estructura del documento; Las cuestiones de sangría y saltos de línea son importantes, y Jade espera que cada línea comience con algo de lo que creará etiquetas HTML.

Si quieres darle de comer algo que no quiere que se convierta - por ejemplo, el HTML puro o un script o una plantilla prima desea representar en el cliente - usted puede

1) comience cada línea con un carácter de tubería (|), seguido de texto sin procesar. Ejemplo de Jade docs:

p 
    | foo bar baz 
    | rawr rawr 
    | super cool 
    | go jade go 

2) iniciar un bloque de texto en bruto poniendo fin a la etiqueta de contenedor anterior con un punto. docs ejemplo, de nuevo de Jade:

p. 
    foo asdf 
    asdf 
    asdfasdfaf 
    asdf 
    asd. 

Por otra parte, Jade realiza la interpolación de cadenas, el tratamiento de algunos personajes o caracteres, especialmente las que pueda necesitar para escapar en contextos en los que no desea que interpolar. Esta es la parte sobre la que se pregunta (escapatoria). Jade en realidad no trata {especialmente, pero sí trata # {especialmente. Si necesita # {, puede escapar de él como \ # {.

Answer 3

Jade proporciona un operador de punto (.) Al final de la línea que le permite escapar de todo dentro del bloque de sangría secundaria.

script(id='BoardListTemplate', type='text/x-jQuery-tmpl'). 
    // Everything inside here is completely escaped. 
    <p>${Title}</p> 
    <ul id="${Id}" class="IterationBoardList"> 
    <li class="AddNewItem">Add new Item</li> 
    {{tmpl(Items) "#BoardListItemTemplate"}} 
    </ul> 

- // outside here it's all JADE. 
h1 How about a JADE heading 

script(id='BoardListItemTemplate', type='text/x-jQuery-tmpl'). 
    // back to escaped script in here. 
    <li class="Item" id="${{$data.Id}}"> 
    ${$data.Description}<br /> 
    Assigned to: ${$data.AssignedTo}<br/> 
    StoryPoints: ${$data.StoryPoints}</li> 

script(src='/javascripts/Scrummr.Engine.js', id='BoardListItemTemplate', type='text/javascript'). 

El DOT (.) Al final es la parte importante.