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

Cercando di utilizzare handlebars.js per il template, ma la libreria sembra ignorare punto e a capo.

Qual è il modo corretto di trattare con i ritorni a capo? Dovrebbero essere sostituito manualmente dopo l’applicazione di modelli di azione?

  • Il manubrio non fare nulla con i ritorni a capo nel modello. Qual è il modello che si sta avendo problemi con, che cosa fa l’HTML come, e non si desidera che il codice HTML per look?
  • testo con i ritorni a capo e voglio manubrio impianto di testo con <br>
  • Dovrete farlo voi, possibilmente utilizzare un helper.
InformationsquelleAutor Uri | 2012-09-08

 

6 Replies
  1. 83

    Non farlo automaticamente, ma con l’helper funzione di questo obiettivo può essere raggiunto:

    JS:

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

    <div>
        {{breaklines description}}
    </div>
    
    • Per utilizzare questo Meteor, immediatamente richiamata la funzione di espressione che definisce il Manubrio.Utils deve essere copiato e incollato in un in-app .file js. Per qualsiasi motivo, non è normalmente accessibile dall’interno della Meteora. Si trova in .meteor/local/build/server/node_modules/handlebars/lib/handlebars/utils.js.
    • Perché abbiamo bisogno di toString()? escapeExpression già restituisce una stringa, no?
    • Hmm. Corretto.
    • Grazie. Questo è un ottimo modo per farlo. Funziona
    • Per la Brace, ho dovuto usare Ember.Handlebars.registerBoundHelper
    • Questa risposta non funziona e non è aggiornato…vedi il triplo delle parentesi graffe risposta qui sotto
    • Dove devo farlo? Ho Handlebars is not defined

  2. 28

    Con l’inserimento di tre graffe invece delle normali due, è possibile utilizzare manubri per fermare le normali tecniche di fuga html espressioni come <br> e <p>;

    Per esempio, dal manubrio sito web:

    “Manubri HTML sfugge valori restituiti da una {{expression}}. Se non si desidera che il Manubrio per sfuggire a un valore, utilizzare il “triple-stash”, {{{.”

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

        <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>
    
    • che ha lavorato per me – l’ho trovato più facile per impostare le interruzioni di riga lato server, volevo solo HB usarli
    • Tranne se si utilizza il contenuto generato dall’utente da una textarea HTML sarà sfuggito a tutti e ora avete un XSS vettore come l’uso, si possono inserire i tag script.
    • Questo ha bisogno di più upvotes come questa soluzione è molto più semplice e lineare. Nel mio caso mi è stato utilizzando github.com/yads/nodemailer-express-handlebars e avrei bisogno di importare il Manubrio.Utils classe (come indicato in un commento di un’altra risposta).
    • Sì, la soluzione accettata non per me ha funzionato senza problemi. Questo ha fatto.
    • Super easy way! grazie!
    • molto meglio…la “giusta” risposta di cui sopra non è aggiornato e non funziona più
    • Questo è ESATTAMENTE quello che stavo cercando! Grazie!
    • Wow, tanti upvotes per l’introduzione di un vettore inviato!! Il triple-slash espressione deve essere utilizzato solo se siete sicuri al 100% i contenuti del modello. Che è, almonst mai!

  3. 10

    Qui ci sono due approcci preferisco quello attualmente accettato risposta:

    1. Utilizzare white-space: pre-wrap; o white-space: pre; sull’elemento in cui si desidera mantenere le interruzioni di linea (attivazione o la soppressione naturale della linea di confezionamento, rispettivamente). Se si desidera che le sequenze di spazi vuoti per essere compresso, che è come il testo in HTML è normalmente presentato, utilizzare white-space: pre-line; ma nota che IE8 e sotto non supportano questa. https://developer.mozilla.org/en-US/docs/Web/CSS/white-space
    2. O qui è una versione del modello helper 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

  4. 1

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

    Ma mi sono accorta che quando mi registro, l’aiutante, il parametro di una funzione che riceve non è il testo, ma la funzione che è chiamato all’interno del Manubrio modello. Quindi, prima ho dovuto chiamare per ottenere il testo.

    Per chiarire, ho avuto a che 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 per farlo funzionare.

    • Per la Brace, ho dovuto usare Ember.Handlebars.registerBoundHelper
  5. 1

    Qualsiasi soluzione che utilizza un triplo staches si aprirà l’applicazione di attacchi XSS a meno che non si implementare qualcosa per disinfettare l’HTML.

    Vorrei suggerire utilizzando il <pre> tag, piuttosto che la creazione di un custom helper.

  6. 0

    Per altri come me che hanno seguito il Ottenere il codice di avvio e non so perché c’è stato nessun HTML mostrando.

    in manubrio espressioni documentazione
    si afferma

    Manubrio HTML sfugge valori restituiti da una {{espressione}}. Se non si desidera che il Manubrio per sfuggire a un valore, utilizzare il “triple-stash”, {{{

Lascia un commento