zoukankan      html  css  js  c++  java
  • mustache.js 使用

      对于mustache模板,我是属于即用即查的方法,以下记录仅是我常用的方式。方便以后使用时不用再去项目中去找,因为真的不好找。(此处 -->serious 脸)

      当需要渲染一些数据列表的时候,使用这个模板是比较快捷的。(具体详情语法看文档)

       一.首先需要添加html模板部分。

       <script id="template" type="x-tmpl-mustache">

        {{#data}}   -->列表数据 

           //此处只是示例,换成需要循环的列表即可 

          <h3 class="order-num-box">订单号:<span class="order-num">{{payid}}(此处写数据循环列表中的变量名,为了绑定字段中的内容不需要被转义我们可以{{&payid}})</span> 

          <span class="item-time pull-right">下单时间:{{paytime}}</span>

        </h3> 

        {{/data}}
      </script>

       二. 获取模板

           var tmpl = $('#template').html();

      三. 渲染模板

        function showRecordData(data) {

           Mustache.parse(tmpl);

          var rendered = Mustache.render(tmpl, {
          dataRecord: data,  //数据源   --对象数组
          render: function() {  //如果有需要根据不同状态或者类型返回不同的值或者html片段时,可以通过函数来实现
          if (this.type == 类型值) {
              return "...." ;
            
          } else {
             return "...";

        }
      }
      });
      return rendered;  //返回渲染好的html数据。 
    }

  • 相关阅读:
    Python 爬虫 —— BeautifulSoup
    sklearn、theano、TensorFlow 以及 theras 的理解
    sklearn、theano、TensorFlow 以及 theras 的理解
    keras 的使用
    keras 的使用
    古人的字、号、别称
    古人的字、号、别称
    hdu1226 超级密码 (BFS,里面用了大数取余原理)
    2013渣打科营编程马拉松赛样题
    对象序列化实现深度克隆
  • 原文地址:https://www.cnblogs.com/jjworld/p/6905204.html
Copyright © 2011-2022 走看看