web-dev-qa-db-ja.com

どんな種類のテンプレートがあります WP メディアモーダルのテンプレート？

私はWordpressのテンプレートを見ていました（JSに文字列を追加するのではなく、ページに書かれているHTML）。

たとえばポストエディタには、このようなテンプレートがたくさんあります。

<script type="text/html" id="tmpl-uploader-status-error">
        <span class="upload-error-filename">{{{ data.filename }}}</span>
        <span class="upload-error-message">{{ data.message }}</span>
    </script>

今、私はこれらが例えばHTMLレンダリングされるためにwp.media.template('uploader-status-error')( data )で参照されることができることを知っています、しかしこれはどんなタイプのテンプレートですか？ wp-viewsはBackboneなので、これはアンダースコアになると思いますが、 アンダースコア構文 ではないようです。これはどこに文書化されていますか？

javascriptmedia-modalbackboneunderscore
2
NoBugs

これは http://underscorejs.org/#template からの興味深い部分です。

ERBスタイルの区切り文字がお茶ではない場合は、Underscoreのテンプレート設定を変更して、別のシンボルを使用して補間コードを無効にすることができます。逐語的に補間されるべき表現に一致するように補間正規表現、HTMLになった後に挿入されるべき表現に一致するためにエスケープ正規表現を定義する--escaped、および結果の文字列に挿入せずに評価する必要がある式に一致させるためのevaluate正規表現。 3つの組み合わせを定義または省略することができます。たとえば、Mustache.jsスタイルのテンプレートを実行するには、次のようにします。

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

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

=> "こんにちは口ひげ！"

/wp-includes/js/wp-util.jsをチェックアウトすると、これらの内挿、 escape 、評価正規表現がどのように行われるかがわかります。 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 );
        };
    });

そしてこのコメントに注意してください。

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

これが関連チケット ＃22344 とそれについての議論です。

3
birgire