javascript - ejemplos - Ayudante de manillares-devolviendo HTML no texto

title html css

Question

Escribí un simple ayudante para mi plantilla. Aquí está el código:

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

Así que paso una cadena, y divido la cadena por ''|'' personaje. También quiero poner la segunda parte en las etiquetas span.

El problema es que el resultado que se devuelve es texto puro, por lo que obtengo etiquetas span como texto, no HTML.

¿Alguien sabe cuál es el truco?

Tnx

Answer 1

No necesitas utilizar SafeString . En su lugar, use los "bigotes triples" del manillar:

Desde el sitio web de Handlebars , sección de Escape HTML:

Manillares HTML: escapa valores devueltos por un {{expresión}}. Si no quiere que los manillares escapen de un valor, use el "triple-alijo", {{{.

Por lo tanto, una simple cita triple en su html evitará escapar:

{{{splitQuote}}} 

Answer 2

Tienes que marcar la cadena como html en tu ayudante si quieres que Handlebars no se escape. Utilice Handlebars.safeString para hacer esto. El siguiente debe satisfacer sus necesidades

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

Como se mencionó en los comentarios, probablemente debería escapar de la cadena pasada utilizando Handlebars.Utils.escapeExpression(string) para codificar la cadena antes de realizar su formateo personalizado. Recomiendo escribir así:

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
});