2012-05-18 4 views
19

Ich benutze die Lenkstange Templating-Engine auf der App, die ich baue, um die Daten zu rendern, die ich vom Server bekomme.So dekodieren HTML-Entität mit Lenkstangen

Ich weiß, dass es HTML-Werte standardmäßig entkommt und dass Sie die dreifachen Klammern {{{text}}} verwenden müssen, damit text: <p>Example</p> als ein HTML-Element gerendert werden kann.

Das Problem ist, was mache ich, wenn die Daten, die ich erhalte, einschließlich der HTML-Tags, bereits maskiert ist?

Also, wenn ich empfange Daten wie:

text: &lt;p&gt;Example&lt;/p&gt; 

Wie erzwinge ich Lenker, es zu übersetzen und sie als normale HTML zu machen?

+2

Die meisten Vorlagensprachen gehen davon aus, dass die Daten entweder für die Zielausgabe codiert sind oder einfacher Text, der codiert werden muss. Sie kommen nicht mit "decode from arbitrary encode" Features. – Quentin

Antwort

36

Sie müssen es zuerst dekodieren, dann übergeben Sie es an Lenker mit dreifachen Klammern. Ich kenne eine kleine Spitze HTML-Entities mit jQuery zu entschlüsseln:

// encoded is "&lt;p&gt;Example&lt;/p&gt" in your example 
var decoded = $('<textarea />').html(encoded).val(); 
// decoded should now return <p>Example</p> 
+2

+1 für die Verwendung dieses netten Hacks zu decodieren ohne die Notwendigkeit von '.replace (/>/g, '>') .replace (/ &/g, '&') .replace (/"/g, '"') .replace (/ '/ g,' ' ') .replace (/ GodLesZ

+0

Danke, netter Trick :) – Maverick

+0

Es macht mir nichts aus, zweimal für diese Antwort zu wählen, wenn ich kann. –

4

Lenker bietet Helfer und schreiben einen benutzerdefinierten Helfer wie unter folgt Hanlebars_helpers.js

Handlebars.registerHelper('encodeMyString',function(inputData){ 
    return new Handlebars.SafeString(inputData); 
}); 

und verwenden diese Helfer in Ihrer .handlebar Dateien oder .hbs Dateien als

{{encodeMyString myHTMLData}} 

Ohne Hilfe von JQuery folgt Sie es verwenden, können eine beliebige wo in deinem Lenker. Auch Sie können den Helper verwenden, um die Daten allein zu übergeben, und die Daten mit vorangestellten und angehängten Tags zurückgeben.