晒一手hbs helper
最近项目中用到hbs模版,结合express,感觉还不错。其中,helper是handlebar的核心,为了让自己用得更爽,经过搜集和琢磨,留下一手helper,亲测有效。
1. block与extend
源码
let blocks = {};
hbs.registerHelper('extend', function (name, context) {let block = blocks[name];if (!block) {block = blocks[name] = [];}block.push(context.fn(this));
});hbs.registerHelper('block', function (name) {let val = (blocks[name] || []).join('\n');blocks[name] = [];return val;
});
使用
layout.hbs(page1页面母版)
<head><meta charset="UTF-8"><title>{{{block "title"}}}</title>
</head>
page1.hbs(子页面)
{{#extend "title"}}
测试标题
{{/extend}}
=>
<head><meta charset="UTF-8"><title>测试标题</title>
</head>
2. 包含
源码
hbs.registerHelper('include', function (args1, args2, context) {let array = args2.split(',');if (!_.isArray(array)) {return context.inverse(this);}if (_.includes(array, args1) || _.includes(array, args1.toString())) {return context.fn(this);}
});
使用
{{#include '1' '1,2,3'}}
'1' include in '1,2,3'
{{else}}
'1' not include in '1,2,3'
{{/include}}
---
{{#include 'b' 'c,d'}}
'b' include in 'c,d'
{{else}}
'b' not include in 'c,d'
{{/include}}
=>
'1' include in '1,2,3'
---
'b' not include in 'c,d'
3. 等于
源码
hbs.registerHelper('equal', function (args1, args2, context) {if (args1 === args2) {//满足添加继续执行return context.fn(this);} else {if (typeof(args1) === 'number' && args1.toString() === args2.toString()) {return context.fn(this);}//不满足条件执行{{else}}部分return context.inverse(this);}
});
使用
{{#equal 1 2}}
1 === 2
{{else}}
1 !== 2
{{/equal}}
=>
1 !== 2
4. 大于等于
源码
hbs.registerHelper('egt', function (args1, args2, context) {if (args1 >= args2) {return context.fn(this);} else {return context.inverse(this);}});
使用同equal
5. 大于
源码
hbs.registerHelper('gt', function (args1, args2, context) {if (args1 > args2) {return context.fn(this);} else {return context.inverse(this);}});
使用同equal
6. 小于等于
源码
hbs.registerHelper('elt', function (args1, args2, context) {if (args1 <= args2) {return context.fn(this);} else {return context.inverse(this);}});
使用同equal
7. 小于
源码
hbs.registerHelper('lt', function (args1, args2, context) {if (args1 < args2) {return context.fn(this);} else {return context.inverse(this);}});
使用同equal
8. 结合each实现遍历N次
源码
hbs.registerHelper('count', function (args1, context) {let array = [];for (let i = 1; i <= args1; i++) {array.push(i);}return context.fn(array);
});
使用
{{#count 5}}{{#each this |index|}}{{index}}、{{/each}}
{{/count}}
=>
1、2、3、4、5
9. 加法
源码
hbs.registerHelper('add', function (args1, args2) {return args1 + args2;
});
使用
{{add 1 2}}
=>
3
10. 减法
源码
hbs.registerHelper('sub', function (args1, args2) {return args1 - args2;
});
使用
{{sub 3 1}}
=>
2
晒一手hbs helper相关推荐
- hbs helper分享
2019独角兽企业重金招聘Python工程师标准>>> 最近项目中用到hbs模版,结合express,感觉还不错.其中,helper是handlebar的核心,为了让自己用得更爽,经 ...
- amazeui中内置的web组件有哪些且如何用
amazeui中内置的web组件有哪些且如何用 一.总结 一句话总结: 1.组件还是jquery.js+amazeui.js,和插件一样,准确的说是amazeui.css+jquery.js+amaz ...
- koa --- 扩展hbs方法
moment 是一款常用的处理时间的库 传入 1999-03-01T16:00:00.000Z YYYY/MM/DD 输出 1999/03/02 const moment = require('mom ...
- 印刷体是什么意思_家长晒出4年级小学霸课前笔记,字迹堪比“印刷体”,老师都羡慕...
目前,很多小学生都在家里上网课,为了达到最佳学习效果,要提前做好预习工作,尤其是语文这一学科,更需要预习.这不就有一位4年级学霸的家长晒出了孩子日常课前预习笔记. 他不仅对文章进行了合理的布置和预习, ...
- Express模版引擎hbs备忘
最近几天折腾了下express,想找个合适的模版引擎,下面是一些折腾过程的备忘 选择标准 选择一门模版语言时,可能会考虑的几点 语法友好(micro tmpl那种语法真是够了) 支持模版嵌套(子模版的 ...
- hbs模板(zmaze ui用的)
hbs模板(zmaze ui用的) 一.总结 1.模板引擎:就是来生成界面的啊,只不过实现了view和数据分离以及一些其它的功能(预加载等). 2.Handlebars :但他是一个单纯的模板引擎,在 ...
- 兴能元创建「晒啦」社交圈子·共建Web3数字篮球时代!
从融入5G.VR.AR等数字手段的"文创+IP",到拥有广袤想象空间的元宇宙--Web3互联网作为数字经济新的增长点之一,已进入发展的快车道,成为众多知名品牌把握数字经济发展机遇, ...
- c++监听键盘_你会为颜值买单吗?杜伽fusion复古键盘晒单体验_键盘
2020-11-03 15:29:508点赞3收藏12评论 创作立场声明:晒单分享,给值友带看看值不值得买? 不说专业,这几年才接触的机械键盘,突然会有种无法自拔的状态,也许是它码字时候利落干脆的段落 ...
- 通用权限管理组件使用说明书V3.0 错误校正 感谢自由软件职业者Helper(767870484)...
有时候,真想做个像样的东西出来,但是往往各方面的能力都不够,这么多人,Helper(767870484)仔细认真的阅读了这个帮助手册.并给给于了指正,在这里非常感谢,你的劳动成果已经被通用权限管理积累 ...
最新文章
- SpringCloud Alibaba 微服务架构版本说明
- 详谈如何定制自己的博客园皮肤
- 读取外部配置文件_SpringBoot外部配置、优先级及配置详解
- Spring Boot 一个依赖搞定 session 共享,没有比这更简单的方案了!
- 修改windows XP/2000/2003用缩略图方式浏览图片时的默认尺寸
- bash历史命令数_如何使用Bash历史记录命令
- CSDN获得c币办法
- CentOS下通过代理安装rails
- 禁忌搜索算法(Tabu Search)的基本原理与算法流程总结
- Mac下Appium环境搭建
- 7天快速掌握MySQL-DAY6
- 全国快递物流查询-快递查询接口-阿里云代码封装
- 诗和远方其实并不遥远
- RJ11电话线水晶头制作方法(图解)
- 搜狗搜索php,搜狗搜索公众号内容提取
- apt-get update “the following signatures couldn’t be verified because the public key is not avail
- excel数据透视表:善用这些功能,提高工作效率!上篇
- 计算机显示器的视频接口有什么不同,电脑显示器用VGA还是HDMI好有什么区别
- 帮师妹写的裁判文书内容提取程序:可做进一步提取模板
- 鸡兔同笼问题----已知鸡和兔的总数量为n,总腿数为m,输入n和m,依次输出鸡的数目和兔的数目。如果无解,则输出 No answer。