Handlebars的if用法和@index用法

最新推荐文章于 2020-03-24 14:59:46 发布

凤凰冷羽

最新推荐文章于 2020-03-24 14:59:46 发布

阅读量4.3k

点赞数

分类专栏： Handlebars 文章标签： Handlebars

本文链接：https://blog.csdn.net/zhangmm122411/article/details/51728601

版权

Handlebars 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

Handlebars的if用法和@index用法

一、模板语言

<script type="text/javascript">
    Handlebars.registerHelper("compare", function(v1, v2, options) {
        if(v1 == v2) {
            return options.fn(this); // 满足添加继续执行
        } else {
            return options.inverse(this); // 不满足条件执行{{else}}部分
        }
    });

    Handlebars.registerHelper("subcontent", function(value) {
        if(value.length > 10) {
            return value.substr(0, 10) + "......"; // 满足添加继续执行
        } else {
            return value; // 不满足条件执行{{else}}部分
        }
    });

    Handlebars.registerHelper("if_more_than_ten", function(value, options) {
        if(value.length > 10) {
            return options.fn(this); // 满足添加继续执行
        } else {
            return options.inverse(this); // 不满足条件执行{{else}}部分
        }
    });
</script>
<script id="flow_history_template" type="text/x-handlebars-template">
    {{#each this}}
        {{#if tit}}
            {{#compare @index 0}}
                <li>
            {{else}}
                <li class="ico_02">
            {{/compare}}
                    <div class="tit">{{tit}}</div>
                    <div class="time">{{time}}</div>
                    <div class="bd">
                        <p><!-- 处理人 --><t:mutiLang langKey="common.processer"/>：{{name}}</p>
                        <p><!-- 处理结果 --><t:mutiLang langKey="common.result_of_processing"/>：<span class="blue">{{result}}</span></p>
                        {{#if_more_than_ten content}}
                            <p style="display:black;">
                                <!-- 处理内容 --><t:mutiLang langKey="common.processer_content"/>：{{subcontent content}}
                                <span class="more"><img src="<%=basePath%>/webpage/letv_common/mobile/images/ico_arrow_down.png" width="16" height="16" alt=""/>展开</span>
                            </p>
                            <p style="display:none;">
                                <!-- 处理内容 --><t:mutiLang langKey="common.processer_content"/>：{{content}}
                                <span class="more"><img src="<%=basePath%>/webpage/letv_common/mobile/images/ico_arrow_up.png" width="16" height="16" alt=""/>收起</span>
                            </p>
                        {{else}}
                            <p style="display:black;">
                                <!-- 处理内容 --><t:mutiLang langKey="common.processer_content"/>：{{content}}
                            </p>
                        {{/if_more_than_ten}}
                    </div>
                </li>
        {{/if}}
    {{/each}}
</script>