javascript - 在 Handlebars 模板中处理多行字符串

Question

从我的服务器返回的 JSON 响应包含一个长字符串（消息正文或多行注释）。

典型的 message.body 可能如下所示：

"Hi!\r\n\r\nHow's life? Everything is well with me\r\n\r\nSincerely,\r\n\r\nAustin\r\n" 

现在使用车把，我像这样嵌入

<p>{{body}}</p>

但是，这会在 html 中呈现为：

<p>"Hi!
How's life? Everything is well with me 

Sincerely, 

Austin"</p>

我怎样才能让它在它自己的 html 段落 [p] 标记中呈现每一行？在rails中，我会用这样的东西（在haml中）

- note.body.each_line do |x|
    %p= x

Answer 1

您可以添加一个把手“助手”

http://handlebarsjs.com/expressions.html （向下滚动到 Helpers）

例如

Handlebars.registerHelper('paragraphSplit', function(plaintext) {
    var i, output = '',
        lines = plaintext.split(/\r\n|\r|\n/g);
    for (i = 0; i < lines.length; i++) {
        if(lines[i]) {
            output += '<p>' + lines[i] + '</p>';
        }
    }
    return new Handlebars.SafeString(output);
});

然后在您的模板调用中

{{paragraphSplit body}}

Answer 2

Handlebars 不喜欢模板中的逻辑。您通常会在模板看到数据之前处理数据，如下所示：

var lines = "...".split(/(?:\r\n)+/);

然后将该数组提供给模板：

var html = tmpl({ body: lines });

在这种情况下，您的模板将如下所示：

{{#each body}}
    {{.}}
{{/each}}

演示：http: //jsfiddle.net/ambiguous/Gbu5w/