改行が含まれる文字列をそのまま表示する方法

困ったこと

改行が含まれている文章がそのまま表示されない。。（改行が空白になる。）

<div>
  {{content)}}
</div>

今日はピクニック。 楽しいな

スタイルを当てよう

test.html

<div class="content">
  {{content)}}
</div>

test.css

.content {
  white-space: pre-wrap; // 要素内のホワイトスペースをどのように扱うか。今回は変更させない。
  word-wrap: break-word; // 日本語の単語をどう扱うか。今回は改行させる。
}

今日はピクニック。
楽しいな

できた