express 中使用
//設置模板目錄 app.set('views', path.join(__dirname, 'views')); //設置模板引擎 app.set('view engine', 'html'); //設置引擎后綴. index.html 中的內容可以是 ejs 代碼 app.engine('.html', require('ejs').__express);
ejs的特性: 1、緩存功能,能夠緩存已經解析好的html模版; 2、<% code %>用於執行其中javascript代碼; 3、<%= code %>會對code進行html轉義; 4、<%- code %>將不會進行轉義; 5、支持自定義標簽,比如’<%‘可以使用’{{’,’%>‘用’}}'代替; 6、提供一些輔助函數,用於模版中使用 7、利用<%- include filename %>加載其他頁面模版;
ejs 函數/運算符
- 引入模板 不指定后綴就尋找 layout.ejs. (注意:如果沒有定義模板目錄,則 include無效)
<% include layout.html%> <%- include layout.html%>
- 靜態編譯模板,沒有 IO 操作,會非常快,而且可以公用本地變量.
-
<% users.forEach(function(user){ %> <% include user/show %> <% }) %>
意思就是模板名是動態的
- 自定義 閉合標簽. 厭倦了 <% %> ?
//設置閉合標簽 var ejs = require('ejs'); ejs.open = '{{'; ejs.close = '}}';
express中全局設定
app.set("view options",{ "open":"{{", "close":"}}" });
- 變量
//傳遞 index 模板引擎參數 res.render('index',{'title':'haha'); //使用參數 <title><%= title %></title>
- 運行js代碼
<%for(var i=p.length-1; i>=0; i--){%> <input type="button" value=<%=p[i]%>> <%}%>
- 選項 express中 通過 res.redirect(‘login’, [options]); 來對模板進行訪問,options就可以設置模板引擎的一些選項 其中options的一些參數為: 1、cache:是否緩存解析后的模版,需要filename作為key; 2、filename:模版文件名; 3、scope:complile后的Function執行所在的上下文環境; 4、debug:標識是否是debeg狀態,debug為true則會輸出生成的Function內容; 5、compileDebug:標識是否是編譯debug,為true則會生成解析過程中的跟蹤信息,用於調試; 6、client,標識是否用於瀏覽器客戶端運行,為true則返回解析后的可以單獨運行的Function函數; 7、open,代碼開頭標記,默認為’<%’; 8、close,代碼結束標記,默認為’%>’; 9、其他的一些用於解析模版時提供的變量。 在express中使用時,options參數將由response.render進行傳入,其中包含了一些express中的設置,以及用戶提供的變量值。
- f輔助函數 此外ejs還提供了一些輔助函數,用於代替使用javascript代碼,使得更加方便的操縱數據。 1、first,返回數組的第一個元素; 2、last,返回數組的最后一個元素; 3、capitalize,返回首字母大寫的字符串; 4、downcase,返回字符串的小寫; 5、upcase,返回字符串的大寫; 6、sort,排序(Object.create(obj).sort()?); 7、sort_by:‘prop’,按照指定的prop屬性進行升序排序; 8、size,返回長度,即length屬性,不一定非是數組才行; 9、plus:n,加上n,將轉化為Number進行運算; 10、minus:n,減去n,將轉化為Number進行運算; 11、times:n,乘以n,將轉化為Number進行運算; 12、divided_by:n,除以n,將轉化為Number進行運算; 13、join:‘val’,將數組用’val’最為分隔符,進行合並成一個字符串; 14、truncate:n,截取前n個字符,超過長度時,將返回一個副本 15、truncate_words:n,取得字符串中的前n個word,word以空格進行分割; 16、replace:pattern,substitution,字符串替換,substitution不提供將刪除匹配的子串; 17、prepend:val,如果操作數為數組,則進行合並;為字符串則添加val在前面; 18、append:val,如果操作數為數組,則進行合並;為字符串則添加val在后面; 19、map:‘prop’,返回對象數組中屬性為prop的值組成的數組; 20、reverse,翻轉數組或字符串; 21、get:‘prop’,取得屬性為’prop’的值; 22、json,轉化為json格式字符串
輔助函數使用
//注意閉合標簽 <%=: %> <input type="button" value=<%=:p|first%>>
- 給模板添加方法
app.locals[‘say’] = function(){ return ‘hello’; }; 在 app.locals 中定義的方法都可以在模板中引用 <input type=“button” value=<%=say()%>>