Show:
Module: template-micro
Parent Module: template

Available since 3.8.0

Fast, simple string-based micro-templating engine similar to ERB or Underscore templates.

Index

Methods

Properties

Methods

compile

(
  • text
  • [options]
)
Function static

Defined in yui3/src/template/js/template-micro.js:65

Available since 3.8.0

Compiles a template string into a JavaScript function. Pass a data object to the function to render the template using the given data and get back a rendered string.

Within a template, use <%= ... %> to output the value of an expression (where ... is the JavaScript expression or data variable to evaluate). The output will be HTML-escaped by default. To output a raw value without escaping, use <%== ... %>, but be careful not to do this with untrusted user input.

To execute arbitrary JavaScript code within the template without rendering its output, use <% ... %>, where ... is the code to be executed. This allows the use of if/else blocks, loops, function calls, etc., although it's recommended that you avoid embedding anything beyond basic flow control logic in your templates.

Properties of the data object passed to a template function are made available on a data variable within the scope of the template. So, if you pass in the object {message: 'hello!'}, you can print the value of the message property using <%= data.message %>.

Parameters:

  • text String

    Template text to compile.

  • [options] Object optional

    Options. If specified, these options will override the default options defined in Y.Template.Micro.options. See the documentation for that property for details on which options are available.

Returns:

Function:

Compiled template function. Execute this function and pass in a data object to render the template with the given data.

Example:

YUI().use('template-micro', function (Y) {
                                                    var template = '<ul class="<%= data.classNames.list %>">' +
                                                                       '<% Y.Array.each(data.items, function (item) { %>' +
                                                                           '<li><%= item %></li>' +
                                                                       '<% }); %>' +
                                                                   '</ul>';
                                                
                                                    // Compile the template into a function.
                                                    var compiled = Y.Template.Micro.compile(template);
                                                
                                                    // Render the template to HTML, passing in the data to use.
                                                    var html = compiled({
                                                        classNames: {list: 'demo'},
                                                        items     : ['one', 'two', 'three', 'four']
                                                    });
                                                });

precompile

(
  • text
  • [options]
)
String static

Defined in yui3/src/template/js/template-micro.js:181

Available since 3.8.0

Precompiles the given template text into a string of JavaScript source code that can be evaluated later in another context (or on another machine) to render the template.

A common use case is to precompile templates at build time or on the server, then evaluate the code on the client to render a template. The client only needs to revive and render the template, avoiding the work of the compilation step.

Parameters:

  • text String

    Template text to precompile.

  • [options] Object optional

    Options. If specified, these options will override the default options defined in Y.Template.Micro.options. See the documentation for that property for details on which options are available.

Returns:

String:

Source code for the precompiled template.

render

(
  • text
  • data
  • [options]
)
String static

Defined in yui3/src/template/js/template-micro.js:206

Available since 3.8.0

Compiles and renders the given template text in a single step.

This can be useful for single-use templates, but if you plan to render the same template multiple times, it's much better to use compile() to compile it once, then simply call the compiled function multiple times to avoid recompiling.

Parameters:

  • text String

    Template text to render.

  • data Object

    Data to pass to the template.

  • [options] Object optional

    Options. If specified, these options will override the default options defined in Y.Template.Micro.options. See the documentation for that property for details on which options are available.

Returns:

String:

Rendered result.

revive

(
  • precompiled
)
Function static

Defined in yui3/src/template/js/template-micro.js:227

Available since 3.8.0

Revives a precompiled template function into a normal compiled template function that can be called to render the template. The precompiled function must already have been evaluated to a function -- you can't pass raw JavaScript code to revive().

Parameters:

  • precompiled Function

    Precompiled template function.

Returns:

Function:

Revived template function, ready to be rendered.

Properties

options

Object static

Defined in yui3/src/template/js/template-micro.js:27

Available since 3.8.0

Default options for Y.Template.Micro.

Sub-properties:

  • [code] RegExp optional

    Regex that matches code blocks like <% ... %>.

  • [escapedOutput] RegExp optional

    Regex that matches escaped output tags like <%= ... %>.

  • [rawOutput] RegExp optional

    Regex that matches raw output tags like <%== ... %>.

  • [stringEscape] RegExp optional

    Regex that matches characters that need to be escaped inside single-quoted JavaScript string literals.

  • [stringReplace] Object optional

    Hash that maps characters matched by stringEscape to the strings they should be replaced with. If you add a character to the stringEscape regex, you need to add it here too or it will be replaced with an empty string.