码迷,mamicode.com
首页 > 其他好文 > 详细

【Layui__模板引擎】layui.laytpl

时间:2020-05-04 13:45:39      阅读:63      评论:0      收藏:0      [点我收藏+]

标签:end   text   模块   uila   func   模板引擎   模板   cti   render   

layui.laytpl快速使用

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <link href="../lib/layui/css/layui.css" rel="stylesheet" />
</head>
<body>

    <div id="view"></div>
    <script src="../lib/layui/layui.js"></script>
    <script id="demo" type="text/html">
        <h3>{{ d.title }}</h3>
        <ul>
            {{#  layui.each(d.list, function(index, item){ }}
            <li>
                <span>{{ item.modname }}</span>
                <span>{{ item.alias }}:</span>
                <span>{{ item.site || ‘‘ }}</span>
            </li>
            {{#  }); }}
            {{#  if(d.list.length === 0){ }}
            无数据
            {{#  } }}
        </ul>
    </script>
    <script>
        var data = { //数据
            "title": "Layui常用模块"
            , "list": [{ "modname": "弹层", "alias": "layer", "site": "layer.layui.com" }, { "modname": "表单", "alias": "form" }]
        }
        layui.use(‘laytpl‘, function () {
            var laytpl = layui.laytpl;
            var getTpl = demo.innerHTML
                , view = document.getElementById(‘view‘);
            laytpl(getTpl).render(data, function (html) {
                view.innerHTML = html;
            });
        });
    </script>
</body>
</html>

【Layui__模板引擎】layui.laytpl

标签:end   text   模块   uila   func   模板引擎   模板   cti   render   

原文地址:https://www.cnblogs.com/kikyoqiang/p/12826145.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!