Handbars.js замества ли символите за нов ред с ‹br›?

Това не се прави автоматично, но с помощната функция това може да се постигне:

JS:

Handlebars.registerHelper('breaklines', function(text) {
    text = Handlebars.Utils.escapeExpression(text);
    text = text.replace(/(\r\n|\n|\r)/gm, '<br>');
    return new Handlebars.SafeString(text);
});

HTML шаблон:

<div>
    {{breaklines description}}
</div>

Чрез вмъкване на три скоби вместо конвенционалните две, можете да инструктирате ръкохватките да спрат нормалните си техники за избягване на html изрази като <br> и <p>;

Например от уебсайта на кормилото:

„Handlebars HTML-escapes стойности, върнати от {{expression}}. Ако не искате Handlebars да екранира стойност, използвайте „triple-stash“, {{{.“

    <div class="entry">
      <h1>{{title}}</h1>
      <div class="body">
        {{{body}}}
      </div>
    </div>

с този контекст:

    {
      title: "All about <p> Tags",
      body: "<p>This is a post about &lt;p&gt; tags</p>"
    }

води до:

    <div class="entry">
      <h1>All About &lt;p&gt; Tags</h1>
      <div class="body">
        <p>This is a post about &lt;p&gt; tags</p>
      </div>
    </div>

Ето два подхода, които предпочитам пред приетия в момента отговор:

1. Използвайте white-space: pre-wrap; или white-space: pre; върху елемента, където искате да запазите прекъсванията на редовете (съответно позволявайки или потискайки естественото обвиване на редове). Ако искате последователности от бели интервали да бъдат свити, което е начинът, по който текстът в HTML обикновено се представя, използвайте white-space: pre-line;, но имайте предвид, че IE8 и по-стари не поддържат това. https://developer.mozilla.org/en-US/docs/Web/CSS/white-space

2. Или ето версия на помощника на шаблона, която не изисква никакво копиране и поставяне на външен код:

   Template.registerHelper('breaklines', function (text) {
     text = Blaze._escape(text);
     text = text.replace(/(\r\n|\n|\r)/gm, '<br>');
     return new Spacebars.SafeString(text);
   });
   

   Вижте https://github.com/meteor/meteor/blob/devel/packages/blaze/preamble.js за Blaze._escape

Използвах кода, публикуван от @Uri и беше много полезен.

Но разбрах, че когато регистрирам помощника, функционалният параметър, който той получава, не е текстът, а функцията, която се извиква в шаблона Handlebars. Така че първо трябваше да му се обадя, за да получа текста.

За да изясня, трябваше да направя:

Handlebars.registerHelper('breaklines', function(descriptionFunction) {
    text = descriptionFunction();
    text = Handlebars.Utils.escapeExpression(text);
    text = text.toString();
    text = text.replace(/(\r\n|\n|\r)/gm, '<br>');
    return new Handlebars.SafeString(text);
});

Това е единственият начин да го накарам да работи.

Всяко решение, което използва тройни staches, ще отвори вашето приложение за XSS атаки, освен ако не внедрите нещо, което да дезинфекцира HTML.

Бих предложил да използвате маркера <pre>, вместо да създавате персонализиран помощник.

За други като мен, които следваха кода Първи стъпки и не знаеха защо не се показва HTML.

в документацията за изрази на кормилото се посочва

Handlebars HTML-escapes стойности, върнати от {{expression}}. Ако не искате Handlebars да избягва стойност, използвайте "triple-stash", {{{