Table of contents

Micro template engine

Metro UI contains micro template engine.

About

Metro UI contains micro template engine. This feature specified in function Metro.template. The function takes 2 parameters: template as string and vars defined as object. Keys supported: var, if, for, else, switch, case, break.

Example

html

                    <div id="template_result"></div>
                
javascript

                    var template =
                         'My skills:' +
                         '
' + '<%if(this.showSkills) {%>' + '
    ' + '<%for(var i = 0; i < this.skills.length; i++) {%>' + '
  • <%this.skills[i]%>
  • ' + '<%}%>' + '
' + '
Total: <%this.skills.length%> main skills' + '<%} else {%>' + '

none

' + '<%}%>'; var result = Metro.template(template, { skills: [ "javascript", "html", "css", "php", "oracle", "mysql", "java", "pascal", "c/c++", "kotlin" ], showSkills: true }); $("#template_result").html(result);
Result

                                <div id="template_result">
                                    My skills:
                                    <hr>
                                    <ul>
                                        <li>javascript</li>
                                        <li>html</li>
                                        <li>css</li>
                                        <li>php</li>
                                        <li>oracle</li>
                                        <li>mysql</li>
                                        <li>java</li>
                                        <li>pascal</li>
                                        <li>c/c++</li>
                                        <li>kotlin</li>
                                    </ul>
                                    <br>
                                    <strong>Total: </strong>10 main skills
                                </div>