Handlebars helper - возврат HTML не текст

Question

Я написал простой помощник для своего шаблона. Вот код:

Handlebars.registerHelper('splitQuote', function (string) { 
    if (string.indexOf('|') !== -1) { 
     return string.replace('|', '<span>') + '</span>'; 
    } 
    return string; 
}); 

Поэтому я передаю строку и разбиваю строку на '|' персонаж. Я также хочу поместить вторую часть в теги span.

Проблема в том, что возвращаемый результат является чистым текстом, поэтому я получаю теги span, такие как текст, а не HTML.

Кто-нибудь знает, что это за улов?

Tnx

Answer 1

Вы должны пометить строку как HTML в вашем помощнике, если вы хотите, чтобы рули не избежать. Используйте Handlebars.safeString для этого. Ниже должны удовлетворить ваши потребности

Handlebars.registerHelper('splitQuote', function(string) { 
    if (string.indexOf('|') !== -1) { 
     return new Handlebars.SafeString(string.replace('|', '<span>') + '</span>'); 
    } 
    return string; 
}); 

Как уже упоминалась в комментариях, вы должны, вероятно, избежать переданной строки, используя Handlebars.Utils.escapeExpression(string) закодировать строку перед тем, как сделать свое собственное форматирование. Я рекомендовал бы писать так:

Handlebars.registerHelper('splitQuote', function(string) { 
    string = Handlebars.Utils.escapeExpression(string); 
    if (string.indexOf('|') !== -1) { 
     string = string.replace('|', '<span>') + '</span>'; 
    } 
    return new Handlebars.SafeString(string); // mark as already escaped 
}); 

Answer 2

вам не нужно использовать SafeString. Вместо этого следует использовать "тройную усу" из рулю:

От Handlebars web site, HTML Экранирования раздела:

Рулей HTML-ускользают значения, возвращаемое выражение {{}}. Если вы не хотите, чтобы Handlebars избегали значения, используйте «triple-stash», {{{.

Итак, простая тройная цитата в вашем HTML позволит избежать побега:

{{{splitQuote}}}