文章詳情頁
Express 框架中使用 EJS 模板引擎并結合 silly-datetime 庫進行日期格式化的實現方法
瀏覽:171日期:2022-06-10 10:03:46
在 Express 框架中使用 EJS 模板引擎并結合 silly-datetime 庫進行日期格式化的步驟如下:
1. 安裝 silly-datetime 庫
可以通過 npm 命令安裝 silly-datetime 庫,命令為:
npm install silly-datetime --save
2. 在 app.js 中配置模板引擎和使用庫方法
在 app.js 文件中,需要配置使用 EJS 模板引擎,并使用 res.locals 將庫方法傳遞給模板。下面是一個例子:
const express = require("express"); const app = express(); const sd = require("silly-datetime"); // 模板引擎配置 app.set("views", __dirname + "/views"); // 設置模板文件夾 app.set("view engine", "ejs"); // 設置視圖模板引擎 // 定義全局變量,模板都可以訪問到 app.use(function (req, res, next) { ? // 將 silly-datetime 的 format 方法用 locals 來代理 ? res.locals.formatDate = function (date, fmt) { ? ? return sd.format(date, fmt); ? }; ? next(); }); // 創建路由和功能代碼 // ...
3. 在模板文件中使用庫方法
在模板文件中,可以使用模板語法調用布局文件中定義的 formatDate 函數。具體方式如下:
<!-- 渲染數據列表 --> <% for(var i=0; i<articles.length; i++) { %> ? <tr> ? ? <td><%= articles[i].title %></td> ? ? <td><%= locals.formatDate(articles[i].created_at, "YYYY-MM-DD HH:mm:ss") %></td> ? </tr> <% } %>
以上模板代碼將使用 silly-datetime 的 format 方法對文章發布時間進行了格式化處理,最終展示為 YYYY-MM-DD HH:mm:ss 格式的日期字符串。
注意:在模板文件中需要正確引入 silly-datetime 庫,否則無法使用 formatDate 函數。
補充說明:silly-datetime 庫的原始用法為:
const sd = require("silly-datetime"); sd.format(new Date(), "YYYY-MM-DD HH:mm:ss");//此處的new Date()位置可以傳入其他日期格式參數
對應的,在app.js中定義該函數給EJS模版使用,則對應形式為:
? res.locals.formatDate = function (date, fmt) { ? ? return sd.format(date, fmt); ? };
相應的,EJS模版中使用該函數,則是需要通過locals來調用定義的formatDate方法,再傳入對應位置的參數即可:
locals.formatDate(articles[i].created_at, "YYYY-MM-DD HH:mm:ss")
該方法經筆者測試可以正常使用。
標簽:
JavaScript
相關文章:
1. 淺談JS和Nodejs中的事件驅動2. 初學者如何快速搭建Express開發系統步驟詳解3. VUE+Express+MongoDB前后端分離實現一個便簽墻4. Vue+express+Socket實現聊天功能5. Express框架定制路由實例分析6. express框架通過ejs模板渲染輸出頁面實例分析7. nodejs報digital envelope routines::unsupported錯誤的最新解決方法8. IIS Express 取代 ASP.NET Development Server的配置方法9. 使用本機IIS?Express開發Asp.Net?Core應用圖文教程10. express框架+bootstrap美化ejs模板實例分析
排行榜
