What type of template are WP media-modal’s templates?

Here’s an interesting part from http://underscorejs.org/#template

If ERB-style delimiters aren’t your cup of tea, you can change
Underscore’s template settings to use different symbols to set off
interpolated code. Define an interpolate regex to match expressions
that should be interpolated verbatim, an escape regex to match
expressions that should be inserted after being HTML-escaped, and an
evaluate regex to match expressions that should be evaluated without
insertion into the resulting string. You may define or omit any
combination of the three. For example, to perform Mustache.js-style
templating:

_.templateSettings = {   interpolate: /\{\{(.+?)\}\}/g };

var template = _.template("Hello {{ name }}!"); template({name: "Mustache"});

=> “Hello Mustache!”

If we check out /wp-includes/js/wp-util.js we see how these interpolate, escape and evaluate regular expressions are defined in WordPress:

/**
 * wp.template( id )
 *
 * Fetch a JavaScript template for an id, and return a templating function for it.
 *
 * @param  {string} id   A string that corresponds to a DOM element with an id prefixed with "tmpl-".
 *                       For example, "attachment" maps to "tmpl-attachment".
 * @return {function}    A function that lazily-compiles the template requested.
 */
wp.template = _.memoize(function ( id ) {
        var compiled,
                /*
                 * Underscore's default ERB-style templates are incompatible with PHP
                 * when asp_tags is enabled, so WordPress uses Mustache-inspired templating syntax.
                 *
                 * @see trac ticket #22344.
                 */
                options = {
                        evaluate:    /<#([\s\S]+?)#>/g,
                        interpolate: /\{\{\{([\s\S]+?)\}\}\}/g,
                        escape:      /\{\{([^\}]+?)\}\}(?!\})/g,
                        variable:    'data'
                };

        return function ( data ) {
                compiled = compiled || _.template( $( '#tmpl-' + id ).html(), null, options );
                return compiled( data );
        };
    });

and note this comment:

/*
 * Underscore's default ERB-style templates are incompatible with PHP
 * when asp_tags is enabled, so WordPress uses Mustache-inspired templating syntax.
 *

Here’s the relevant ticket #22344 and discussion about it.

Leave a Comment