什么是x-tmpl？ [英] What is x-tmpl?

问题描述

正在网上寻找答案，但找不到任何东西。这个小小小小的代码真的让我很失望，因为我无法理解它。 （它是插件的一部分，名为：jQuery文件上传）

 < script id =template-downloadtype =text / X-TMPL> 
 {％for（var i = 0，file; file = o.files [i]; i ++）{％} 
< tr class =template-download fade> 
 {％if（file.error）{％} 
< td>< / td> 
< td class =name>< span> {％= file.name％}< / span>< / td> 
< td class =size>< span> {％= o.formatFileSize（file.size）％}< / span>< / td> 
< td class =errorcolspan =2>< span class =label label-important> {％= locale.fileupload.error％}< / span> {％= locale.fileupload.errors [file.error] || file.error％}< / TD> 
 {％} else {％} 
< td class =preview> {％if（file.thumbnail_url）{％} 
  {％}％}< / td> 
< td class =name> 
< a href ={％= file.url％}title ={％= file.name％} ={％= file.thumbnail_url&&'gallery'％}download = {（％）= file.name％} > {（％）= file.name％}< / A> 
< / td> 
< td class =size>< span> {％= o.formatFileSize（file.size）％}< / span>< / td> 
< td colspan =2>< / td> 
 {％}％} 
< td class =delete> 
< button class =btn btn-dangerdata-type ={％= file.delete_type％}data-url ={％= file.delete_url％}> 
< i class =icon-trash icon-white>< / i> 
< span> {％= locale.fileupload.destroy％}< / span> 
< / button> 
< input type =checkboxname =deletevalue =1> 
< / td> 
< / tr> 
 {％}％} 
< / script> 
  

• 那么，什么类型是 text / x -tmpl ？


• 什么是 {％和％} code> tags？


• 什么解析器执行此代码？


• ...

...但想知道这件事情。

tmpl没有实际意义，它只是停止浏览器将脚本解释为javascript。

它主要用于jquery模板或 knockoutjs模板绑定。

在某些时候，JavaScript数据对象将会与模板一起使用来渲染一些html。数据对象中的值将替换模板中带有{％}和类似内容的部分，其中一些{％}部分反映了诸如循环等代码流。

I不知道哪个模板库使用{％}，但它不是jQuery模板，jsrender或淘汰赛。您必须检查示例代码中正在引用的库。

Was looking for the answer on the net, but couldn't find anything. This little snack of code really frustrates me, as I can't understand it. (It's part of the plugin called: jQuery File Upload)

<script id="template-download" type="text/x-tmpl">
{% for (var i=0, file; file=o.files[i]; i++) { %}
  <tr class="template-download fade">
    {% if (file.error) { %}
        <td></td>
        <td class="name"><span>{%=file.name%}</span></td>
        <td class="size"><span>{%=o.formatFileSize(file.size)%}</span></td>
        <td class="error" colspan="2"><span class="label label-important">{%=locale.fileupload.error%}</span> {%=locale.fileupload.errors[file.error] || file.error%}</td>
    {% } else { %}
        <td class="preview">{% if (file.thumbnail_url) { %}
            <a href="{%=file.url%}" title="{%=file.name%}" rel="gallery" download="{%=file.name%}"><img src="{%=file.thumbnail_url%}"></a>
        {% } %}</td>
        <td class="name">
            <a href="{%=file.url%}" title="{%=file.name%}" rel="{%=file.thumbnail_url&&'gallery'%}" download="{%=file.name%}">{%=file.name%}</a>
        </td>
        <td class="size"><span>{%=o.formatFileSize(file.size)%}</span></td>
        <td colspan="2"></td>
    {% } %}
    <td class="delete">
        <button class="btn btn-danger" data-type="{%=file.delete_type%}" data-url="{%=file.delete_url%}">
            <i class="icon-trash icon-white"></i>
            <span>{%=locale.fileupload.destroy%}</span>
        </button>
        <input type="checkbox" name="delete" value="1">
    </td>
  </tr>
{% } %}
</script>

• So, what type is text/x-tmpl?
• What are these {% and %} tags?
• What parser executes this code?
• ...

...but would like to know everything about this.

解决方案

x-tmpl has no real meaning, it simply stops the browser from interpreting the script as javascript.

It's mostly used with jquery templates or knockoutjs template binding.

At some point, a javascript data object will be used in conjunction with the template to render some html. The values in the data object will replace those marked with {%} and similar in the template, with some {%} sections reflecting code flow such as loops etc.

I'm not sure which templating library uses {%} however, it's not jquery templates, jsrender or knockout. You'd have to check what libraries are being referenced in the sample code.

这篇关于什么是x-tmpl？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！