如何在使用哈巴狗（网页，HTML）时在卡块区域中插入换行符？

Question

我正在尝试在card-block元素 bootstrap v4 中添加换行符 这是pug代码：

  #accordion.mb-3(role='tablist', aria-multiselectable='true')
    .card.bg-inverse
      #headingOne.card-header(role='tab')
        strong.mb-0
          a(data-toggle='collapse', data-parent='#accordion', href='#collapseOne', aria-expanded='true', aria-controls='collapseOne')= fa['user log']
      #collapseOne.collapse.show(role='tabpanel', aria-labelledby='headingOne')
        .card-block(style="font-family: monospace; direction: ltr; max-height: 200px; overflow-y: scroll")
          = fa['sample log']

和js：

fa['sampe log']="how to add a line break here: &#13; <br/> \n \\n \\\n \r \\r &#10; &#13; must be on a new line."

结果：

Answer 1

要让Pug按原样插入变量的内容（而不是在其中转义HTML代码），请使用!=运算符。这适用于fa['sample log']和fa['user log']。

#accordion.mb-3(role='tablist', aria-multiselectable='true')
  .card.bg-inverse
    #headingOne.card-header(role='tab')
      strong.mb-0
        a(data-toggle='collapse', data-parent='#accordion', href='#collapseOne', aria-expanded='true', aria-controls='collapseOne')!= fa['user log']
      #collapseOne.collapse.show(role='tabpanel', aria-labelledby='headingOne')
        .card-block(style="font-family: monospace; direction: ltr; max-height: 200px; overflow-y: scroll")!= fa['sample log']

http://codepen.io/shbelsky/pen/JWqzry