handlebars中的partial
高级玩家:partial
比较推崇使用分页来实现组件化。分页跟helper一样需要先注册。在hbs模块中可以批量注册,比较简单。
hbs.registerPartials(__dirname + '/views/partials');
基础引用
用“>”来引用模板,这种情况一般用来处理页头页尾这种简单的分页。后面可以传入参数。 { {> myPartial param} }
当使用块级表达式时,我们通常添加“#”,而分页是“>”,所以块级分页使用“#>”,这里表示如果layout分页不存在则显示块内的内容My Content。
{ {#> layout } }
My Content
{ {/layout} }
动态分页
当然也可以用表达式来代替分页名称
{ {> (whichPartial) } }
当分页中一部分代码是固定的,另一部分是变化的时候,可以在分页中添加“@partial-block”,这时当引用这个分页时,在内部编写代码将会填充到这个位置。
partial.hbs:
亚里士朱德
{ {> [@partial-block](/user/partial-block) } }
模板:
{ {#>partial} }
https:yalishizhude.github.io
{ {/partial} }
html页面:
亚里士朱德
https:yalishizhude.github.io
内联分页
当有多段代码需要填充到分页时,可以用如下方法。分页中内嵌分页变量,模板中通过内联分页的方式传入。
模板:
{ {#> partial} }
{ {#*inline "nav"} }
亚里士朱德
{ {/inline} }
{ {#*inline "content"} }
https://yalishizhude.github.io
{ {/inline} }
{ {/partial} }
partial.hbs:
<div class="nav">
{ {> nav} }
</div>
<div class="content">
{ {> content} }
</div>
html页面:
<div class="nav">
亚里士朱德
</div>
<div class="content">
https://yalishizhude.github.io
</div>
handlebars中的partial的更多相关文章
- c#中的partial关键字(转)
c#中的partial关键字 Partial: 这是C#2.0的新特性 Partial关键字起到把一个class分段组合作用,能用于多个接口或一个继承 代码片断: namespace Com ...
- Python使用functools模块中的partial函数生成偏函数
所谓偏函数即是规定了固定参数的函数,在函数式编程中我们经常可以用到,这里我们就来看一下Python使用functools模块中的partial函数生成偏函数的方法 python 中提供一种用于对函数固 ...
- asp.net MVC3.0 中@Html.Partial,@Html.Action,@Html.RenderPartial,@Html.RenderAction
asp.net MVC3.0 中@Html.Partial,@Html.Action,@Html.RenderPartial,@Html.RenderAction 1.带有Render的方法返回值是v ...
- Asp.net MVC中Html.Partial, RenderPartial, Action,RenderAction 区别和用法(mvc部分视图的添加)
Partial 和RenderPartial:这两个的性质都是一样, 只指把一个个View给镶入进来, 只是回传值有点不一样Partial 回传的一个Object (MvcHtmlString), 回 ...
- Asp.net MVC中Html.Partial, RenderPartial, Action,RenderAction 区别和用法
Partial 和RenderPartial:这两个的性质都是一样, 只指把一个个View给镶入进来, 只是回传值有点不一样Partial 回传的一个Object (MvcHtmlString), 回 ...
- MVC中@Html.Partial,@Html.Action,@Html.RenderPartial,@Html.RenderAction区别
Html.RenderPartial与Html.RenderAction这两个方法都是用来在界面上嵌入用户控件的. 1. Html.RenderPartial是直接将用户控件嵌入到界面上: <% ...
- 转载ASP.NET MVC 中@Html.Partial,@Html.Action,@Html.RenderPartial,@Html.RenderAction区别
对这四个的区别做一个总结,清理一下思路,方便以后使用: 1.带有Render的方法返回值是void,在方法内部进行输出:不带的返回值类型为MvcHtmlString,所以只能这样使用: @Ht ...
- JavaScript中的Partial Application和Currying
这篇文章是一篇学习笔记,记录我在JS学习中的一个知识点及我对它的理解,知识点和技巧本身并不是我原创的.(引用或参考到的文章来源在文末) 先不解释Partial Application(偏函数应用)和C ...
- 深入理解C#中this/partial/null的使用
一.this关键字作用 1.this表示当前运行中的对象 Eg: public class Person { public int age; public string name; public Pe ...
随机推荐
- freemarker空值的处理
FreeMarker的变量必须赋值,否则就会抛出异常.而对于FreeMarker来说,null值和不存在的变量是完全一样的,因为FreeMarker无法理解null值.FreeMarker提供两个运算 ...
- java基础10(IO流)-字节流
IO流 输入与输出[参照物是程序] 如果从键盘.文件.网络甚至是另一个进程(程序或系统)将数据读入到程序或系统中,称为输入 如果是将程序或系统中的数据写到屏幕.硬件上的文件.网络上的另一端或者是一个进 ...
- vue.js计算属性 vs methods
计算属性:Vue.js 模板内的表达式非常便利,但是缺点就是只能用于简单的运算,如果模板中有太多的逻辑运算会让模板不堪重负且难以维护.恰恰计算属性可以处理复杂的逻辑运算,也就是说对于任何复杂逻辑你都应 ...
- Codeforces Round #373 (Div. 2) A , B , C
A. Vitya in the Countryside time limit per test 1 second memory limit per test 256 megabytes input s ...
- ACM的输入输出总结
关于ACM的输入输出(一) 一般来说ACM的现场赛会规定输入输出 或者是文件输入标准输出 也可能是文件输入文件输出 如果没有规定的话那么一般就是标准的输入输出了 那说一下输入输出的重定向 一般用下面两 ...
- python读取.mat文件的数据
首先导入scipy的包 from scipy.io import loadmat 然后读取 m = loadmat("F:/__identity/activity/论文/data/D001. ...
- 隔行换色(WPF DataGrid 标准例子)
<DataGrid AlternationCount="2"> <DataGrid.RowStyle> ...
- 17-THREE.JS 光晕滤镜
<!DOCTYPE html> <html> <head> <title></title> <script src="htt ...
- js操作获取和设置cookie
//创建cookie function setCookie(name, value, expires, path, domain, secure) { var cookieText = encodeU ...
- selenium-webdirver api-定位方式
1,8种单数定位方式 # 通过ID定位目标元素 driver.find_element_by_id('i1') # 通过className定位目标元素 driver.find_element_by_c ...