2013-11-20 16 views
12

Ho scritto un semplice helper per il mio modello. Ecco il codice:Helper manubrio - restituisce HTML non testo

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

Quindi passo una stringa e divido la stringa per '|' carattere. Voglio anche inserire la seconda parte nei tag span.

Il problema è che il risultato restituito è puro testo, quindi ottengo tag span come un testo, non HTML.

Qualcuno sa qual è il trucco?

Tnx

risposta

31

Bisogna marcare la stringa come HTML nel vostro aiuto, se si desidera Manubrio di non sfuggire. Utilizzare Handlebars.safeString per farlo. Il sotto dovrebbe soddisfare le vostre esigenze

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

Come accennato nei commenti probabilmente si dovrebbe sfuggire la stringa passata utilizzando Handlebars.Utils.escapeExpression(string) per codificare la stringa prima di fare la vostra formattazione personalizzata. Mi consiglia di scrivere in questo modo:

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

Si dovrebbe HTML codificare manualmente 'STRING' prima di aggiungere i' 's se avete intenzione di usare SafeString. –

7

Si Non tiratevi necessità di utilizzare SafeString. Invece, utilizzare i "baffi triple" dal manubrio:

Da Handlebars web site, sezione Escaping HTML:

Manubrio HTML-sfugge valori restituiti da un {{espressione}}. Se non vuoi che Handlebars sfugga a un valore, usa "triple-stash", {{{.

Quindi, una semplice citazione tripla nel tuo html eviterà la fuga:

{{{splitQuote}}} 
Problemi correlati