布局

布局可以通过Beetl提供的include,layout 以及模板变量来完成。模板变量能完成复杂的布局

  • 采用layout include
  1.   <%
  2.    //content.html内容如下：
  3.    layout("/inc/layout.html"){ %>
  4.    this is 正文
  5.    ..........
  6.    <% } %>

如上一个子页面将使用layout布局页面，layout 页面内容如下

  1.   <% include("/inc/header.html"){} %>
  2.   this is content:${layoutContent}
  3.   this is footer:

layoutContent 是默认变量，也可以改成其他名字，具体请参考layout标签函数

全局变量总是能被布局用的页面所使用，如果布局页面需要临时变量，则需要显示的传入，如：

  <%
  var user= model.user;
  include("/inc/header.html",{title:'这是一个测试页面',user:user}){} 
  %>

这样，title和user成为全局变量，能被header.html 及其子页面引用到

  • 继承布局：采用模板变量和include
          <%
                  var jsPart = {
          %>
          web页面js部分

          <% }; %>

          <%
                  var htmlPart = {
          %>
          web页面html部分

          <% };
          include("/inc/layout.html",{jsSection:jsPart,htmlSection:htmlPart}){}
          %>
      layout.html页面如下：
          <body>
          <head>
          ${jsSection}
          </head>
          <body>
          .......
          ${htmlSection}
          </body>