Meteor：如何渲染换行符？答案

【问题标题】：Meteor: How to render line breaks?Meteor：如何渲染换行符？
【发布时间】：2014-03-09 17:14:13
【问题描述】：

我有以下变量：“hello↵↵world”。（值来自文本区域）

问题是当我让 Meteor 用 {{content}} 显示它时，所有内容都出现在同一行并且不考虑换行符。

{{content}}

# renders
hello world

# should render
hello
world

【问题讨论】：

也许 \r 或 \n 或 \r\n 会有所帮助？！

标签： meteor

【解决方案1】：

如果您使用引导程序，使用 <pre> 标签会带有一些您可能不想要的样式...如果您想避免这种情况，您可以使用一些简单的 CSS 来解决这个问题：

.pre {
  white-space: pre;
}

然后用那个类包装你的内容：

<span class="pre">{{content}}</span>

【讨论】：

【解决方案2】：

<pre> 对我来说工作得很好，直到我有很长的文本行。默认情况下，它禁用换行，长行会破坏页面布局或被切断。

您可能可以使用white-space: pre-wrap; 解决它，但我最终做的是创建一个空格键助手，它首先转义文本，然后用<br/> 替换所有中断

UI.registerHelper('breaklines', function(text, options) {
  text = s.escapeHTML(text);
  text = text.replace(/(\r\n|\n|\r)/gm, '<br/>');
  return new Spacebars.SafeString(text);
});

然后，我将通过以下方式在模板中使用帮助程序：

{{breaklines title}}

escapeHTML 是 Underscore.string 的一部分，Underscore.string 是字符串操作扩展的集合，您可以使用 meteor add underscorestring:underscore.string 提取这些扩展，但任何其他转义 html 的方式也应该可以正常工作。

【讨论】：

另一种在不添加包的情况下转义文本的方法是使用未记录的函数Blaze._escape()。

【解决方案3】：

用

包裹

<pre> Any amount of formatting. </pre>

【讨论】：

您也可以将格式应用于 pre 标记（如果您这样做，可能应该向 pre 添加一个类）。像往常一样，有很多方法可以解决同一个问题。这是最低限度的答案。
@Bolster 你救了我的命！！ :D

【解决方案4】：

一种方法是创建一个车把助手：

Handlebars.registerHelper 'breaklines', (text) ->
    text = text.replace /(\r\n|\n|\r)/gm, '<br>'
    return text

然后这样做：（不要忘记三个括号！）

{{{breaklines content}}}

【讨论】：

这会让你的应用程序变得很糟糕，人们可以将标签和 javascript 放入文本字段。是的，您可以提防这种情况，并且可以争辩说您知道文本的来源。但一般这不是随便用的解决方案。
是的，你是对的。我已更改接受的答案。
不是问题，用户添加的内容解析必须在服务器端完成。

【解决方案5】：

只要用<br>就够了，不用再麻烦了。

【讨论】：