А как насчет разрывов строк в нефрите? - PullRequest
63 голосов
/ 25 марта 2011

Я почти уверен, что это легко, но я не нашел ни одного фрагмента примера кода. Каков наилучший способ вставки разрывов строк (он же хороший старый?)?

Насколько я вижу, если я ставлю "br" в начале пустой строки, он отображается как <br/>, но если мне нужно показать несколько строк текста, результирующий код довольно многословен: 1004 *

.poem 
    p 
        | Si chiamava Tatiana, la sorella… 
        br 
        | Noi siamo i primi, almeno lo crediamo
        br 
        | Che un tale nome arditamente nella
        br 
        | Cornice d’un romanzo introduciamo.
        br 
        | E che dunque? E’ piacevole, sonoro.
        br 
        | Lo so che a molti privo di decoro 
        br 
        | Apparirà, già fuori moda, e degno
        br 
        | Piuttosto d’un ancella, certo segno, 
        br 
        | confessiamolo pur senza paura,
        br 
        | di quanto s’è noialtri al gusto avversi
        br 
        | nei nostri nomi (a non parlar di versi). |br
        br 
        | Credemmo conquistare la cultura,
        br 
        | e non ne abbiamo preso, in conclusione,
        br 
        | che la ricerca dell’affettazione.

Есть ли лучший способ решить эту проблему? (кстати, я прошу то же самое с тегом изображения ...)

Ответы [ 10 ]

54 голосов
/ 19 июля 2011

Самое чистое и простое решение - использовать атрибут стиля white-space: pre; например:

.poem 
    p(style='white-space:pre;')
        | Si chiamava Tatiana, la sorella… 
        | Noi siamo i primi, almeno lo crediamo
        | Che un tale nome arditamente nella
        | Cornice d’un romanzo introduciamo.
        | E che dunque? E’ piacevole, sonoro.
        | Lo so che a molti privo di decoro 
        | Apparirà, già fuori moda, e degno
        | Piuttosto d’un ancella, certo segno, 
        | confessiamolo pur senza paura,
        | di quanto s’è noialtri al gusto avversi
        | nei nostri nomi (a non parlar di versi). |br
        | Credemmo conquistare la cultura,
        | e non ne abbiamo preso, in conclusione,
        | che la ricerca dell’affettazione.
50 голосов
/ 26 марта 2011

Я понял это.Просто идите вперед и добавьте туда хороший старомодный тег <br />.Вы будете золотой:)

p
 |hey this is my <br />
 |broken paragraph!

ОБНОВЛЕНИЕ : Jade теперь поддерживает использование только br для разрывов строк.

6 голосов
/ 17 апреля 2013

чтобы вы знали ... если вы извлекаете эту информацию .. скажем, из базы данных SQL, где вы уже вручную вводили разрывы строк (например, в текстовой области формы), вы можете выполнить сервер к вашему выводу

var contentParse = function(content){
    content = content.replace(/\n?\r\n/g, '<br />' );
    return content;
};

, а затем в нефрите использовать

!{content}

! пусть jade знает, что вы вставляете необработанный html в переменную, которую вы пытаетесь отобразить

источник: https://github.com/visionmedia/jade#tag-text

5 голосов
/ 12 декабря 2016

Это не похоже на ответ, поэтому:

Вы также можете сделать это, добавив встроенные теги br, используя формат встроенных тегов Jade / Pug, например ::

p.
    Some text on the first line.#[br]
    Some text on the second line.

Производит:

  <p>Some text on the first line.<br>
    Some text on the second line.
  </p>
5 голосов
/ 26 марта 2011

надежно с делением на строку:

p.poem 
  .line Si chiamava Tatiana, la sorella… 
  .line Noi siamo i primi, almeno lo crediamo
  .line Che un tale nome arditamente nella
  .line Cornice d’un romanzo introduciamo.
  .line E che dunque? E’ piacevole, sonoro.
  .line Lo so che a molti privo di decoro 
  .line Apparirà, già fuori moda, e degno
  .line Piuttosto d’un ancella, certo segno, 
  .line confessiamolo pur senza paura,
  .line di quanto s’è noialtri al gusto avversi
  .line nei nostri nomi (a non parlar di versi).
  .line Credemmo conquistare la cultura,
  .line e non ne abbiamo preso, in conclusione,
  .line che la ricerca dell’affettazione.

или просто с предварительным:

style pre.poem {font-family: ariel}

pre.poem 
  Si chiamava Tatiana, la sorella… 
  Noi siamo i primi, almeno lo crediamo
  Che un tale nome arditamente nella
  Cornice d’un romanzo introduciamo.
  E che dunque? E’ piacevole, sonoro.
  Lo so che a molti privo di decoro 
  Apparirà, già fuori moda, e degno
  Piuttosto d’un ancella, certo segno, 
  confessiamolo pur senza paura,
  di quanto s’è noialtri al gusto avversi
  nei nostri nomi (a non parlar di versi). 
  Credemmo conquistare la cultura,
  e non ne abbiamo preso, in conclusione,
  che la ricerca dell’affettazione.
0 голосов
/ 16 августа 2018

Дайте вашему абзацу стиль, чтобы сохранить символы новой строки, и завершите строку p точкой:

.poem 
  p(style="white-space: pre-line;").
    Si chiamava Tatiana, la sorella… 
    Noi siamo i primi, almeno lo crediamo
    Che un tale nome arditamente nella
    Cornice d’un romanzo introduciamo.
    E che dunque? E’ piacevole, sonoro.
    Lo so che a molti privo di decoro 
    Apparirà, già fuori moda, e degno
    Piuttosto d’un ancella, certo segno, 
    confessiamolo pur senza paura,
    di quanto s’è noialtri al gusto avversi
    nei nostri nomi (a non parlar di versi).
    Credemmo conquistare la cultura,
    e non ne abbiamo preso, in conclusione,
    che la ricerca dell’affettazione.
0 голосов
/ 17 апреля 2017

это тоже хорошо работает.

div
   pre
      | this is line 1
      | this is line 2
0 голосов
/ 02 июня 2016

На всякий случай, если вы не использовали фильтр года в первом поиске: Как добавить тег br с помощью Jade HTML

Поместить текст в новую строку с предшествующим |:

p first line
br
| second line
0 голосов
/ 08 июля 2015

Попробуйте это:

- for(var i = 0; i < 10; i++)
    | hello
    | world
0 голосов
/ 07 января 2014

Я смог сделать следующее после @ haxxxton

app.use(function(req, res, next){
  var contentParse = function (content){
      content = content.replace(/\n?\r\n/g, '<br />' );
      return content;
  };
  res.locals.contentParse = contentParse;
  next();
});

Например, его можно использовать в нефритовом шаблоне с помощью функции p!= contentParse(post.description)

...