handlebars.js sostituisce i caratteri di nuova riga con <br>?

Tentativo di utilizzare handlebars.js per il template ma la libreria sembra ignorare newline.handlebars.js sostituisce i caratteri di nuova riga con <br>?

Qual è il modo corretto per gestire le nuove linee? Dovrebbero essere sostituiti manualmente dopo l'azione del template?

fonte

2012-09-08 Uri

manubrio non fare nulla con newline nel tuo modello. Qual è il modello con cui hai problemi, che aspetto ha l'HTML e vuoi che l'HTML appaia? –

@muistooshort ha il testo con le nuove righe e voglio che i manubri piantino il testo con
invece – Uri

Dovrai farlo tu stesso, possibilmente usare un aiutante. –

E non lo fa automaticamente, ma utilizzando gli assistenti dispongono di questo può essere realizzato:

JS: Modello

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>

fonte

2012-09-12 23:51:23 Uri

Per utilizzare questo in Meteor, l'espressione di funzione immediatamente invocata che definisce Handlebars.Utils deve essere copiata e incollata in un file .js in-app. Per qualsiasi motivo, non è normalmente accessibile da Meteor. Si trova in '.meteor/local/build/server/node_modules/handlebars/lib/handlebars/utils.js'. – wizonesolutions

Perché abbiamo bisogno di 'toString()'? escapeExpression restituisce già una stringa, no? –

Hmm. Corretto. – Uri

Ho usato il codice pubblicato da @Uri ed è stato molto utile.

Ma mi sono reso conto che quando registro l'helper, il parametro di funzione che riceve non è il testo, ma la funzione che viene chiamata all'interno del modello di Handlebars. Quindi prima ho dovuto chiamarlo per ottenere il testo.

Al fine di chiarire, ho dovuto fare:

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

questo è l'unico modo ho potuto farlo funzionare.

fonte

2012-11-02 14:56:21

Per Ember, ho dovuto usare' Ember.Handlebars.registerBoundHelper' – gerry3

Inserendo tre parentesi anziché i due convenzionali, è possibile indicare ai manubri di interrompere le normali tecniche di escape di espressioni html come <br> e <p>;

Ad esempio, dal sito manubrio:

"manubrio HTML-sfugge valori restituiti da un {{expression}} Se non si desidera manubrio per sfuggire a un valore, utilizzare il 'triple-scorta'., {{{"

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

con questo contesto:

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

risultati in:

<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>

fonte

2013-08-02 21:10:40

che ha funzionato per me - ho trovato più facile impostare le interruzioni di linea lato server, volevo solo che HB li usasse – Leon

Tranne se stai usando contenuti generati dagli utenti da una textarea, nessun HTML sarà sfuggito affatto e ora hai un vettore XSS dato che l'utilizzo potrebbe inserire tag di script. –

Ciò richiede più upvotes poiché questa soluzione è molto più semplice e diretta. Nel mio caso stavo usando https://github.com/yads/nodemailer-express-handlebars e avrei bisogno di importare la classe Handlebar.Utils (come indicato su un commento di un'altra risposta). – Xeroxoid

Qualsiasi soluzione che utilizza staches triple si aprirà l'applicazione per attacchi XSS a meno che non si sceglie di implementare qualcosa per disinfettare il codice HTML.

Suggerirei di utilizzare il tag <pre> anziché creare un helper personalizzato.

fonte

2015-07-26 14:05:48 ryanw51

Qui ci sono due approcci che preferisco sopra la risposta attualmente accettata:

Usa white-space: pre-wrap; o white-space: pre; sull'elemento in cui si desidera preservare la line-break (permettendo e nella soppressione di linea naturale di avvolgimento rispettivamente). Se vuoi che le sequenze di spazi bianchi vengano compresse, ovvero come viene normalmente presentato il testo in HTML, utilizza white-space: pre-line; ma nota che IE8 e versioni successive non supportano questo.https://developer.mozilla.org/en-US/docs/Web/CSS/white-space

O qui è una versione del aiutante modello che non richiede alcuna copia e incolla di codice esterno:

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

Vedere https://github.com/meteor/meteor/blob/devel/packages/blaze/preamble.js per Blaze._escape

fonte

2015-11-08 13:46:08

handlebars.js sostituisce i caratteri di nuova riga con <br>?

risposta

Problemi correlati