Erste Schritte mit Mustache.js: Verwendung der Node.js-Template-Engine Mustache.js

Erste Schritte mit Mustache.js: Verwendung der Node.js-Template-Engine Mustache.js

Dieser Artikel erklärt, wie man mustache.js verwendet, eine Template-Engine-Bibliothek, die mit Node.js verwendet werden kann. Diese Bibliothek wird weit verbreitet für die Generierung von Ansichten in Web-Anwendungs-MVC und die Manipulation von Textdaten verwendet.

Installation

npm install mustache --save

require

var fs = require('fs');
var path = require('path');

var Mustache = require('mustache');

Grundlegendes Verwendungsbeispiel

var view = {
  title: "Joe",
  calc: function () {
    return 2 + 4;
  }
};

var template = `
basic usage: {{title}} spends {{calc}}
`;

var output = Mustache.render(template, view);

console.log(output);

Ausgabe:

basic usage: Joe spends 6

Bedingte Verzweigung (if)

{{#NOTEFILE}}
  note file found.
    {{NOTEFILE}}
{{/NOTEFILE}}

Wenn Bedingung falsch ist (unless)

{{^NOTEFILE}}
    no note file found.
{{/NOTEFILE}}

Kommentare

<header class='split-view-inspector-header'>
    <div class="view-title">Source Assets</div>
    {{!  <div class="actions"> commented
        <span class="label">Actions</span>
        <span class="gear"></span>
    </div> }}
</header>

Ausgabe:

<header class='split-view-inspector-header'>
    <div class="view-title">Source Assets</div>
</header>

Benutzerdefinierte Trennzeichen

var customTags = ['<%', '%>'];
Mustache.tags = customTags;

var template = `
Custom Delimiters: <% title %>
`;

var output = Mustache.render(template, view, {}, customTags);

console.log(output);

Ausgabe:

Custom Delimiters: Joe

Ändern benutzerdefinierter Trennzeichen innerhalb des Templates

var template = `
Custom delimiter inside template:

* {{ title }}
* <% title %>
{{=<% %>=}}
* {{ title }}
* <% title %>
<%={{ }}=%>
* {{ title }}
* <% title %>
`;

var output = Mustache.render(template, view);

console.log(output);

Ausgabe:

Custom delimiter inside template:

* {{ title }}
* Joe
* Joe
* Joe

Für weitere Details konsultieren Sie bitte die janl/mustache.js GitHub-Seite.