視頻講解
#Deno 頁面渲染#
我們一起來完成以下步驟:
-
1. 首先來了解一下支持頁面渲染都有哪些組件:
NO Name Star A Denjucks 13 B Ejs 4.5K C Handlebars 15.4K 我們今天要學Ejs模板引擎入門。其他兩個如法炮製
-
2. 創建Controller
-
3. 創建Router
-
3. 創建頁面index.ejs
-
4. 創建主應用文件main.ts
-
5. 測試
#controllers/controller.ts
const { cwd } = Deno;
class Controller {
static async getData(ctx: any){
//cwd獲取當前工程目錄
//注意 ' ！== `
ctx.render(`${cwd()}/views/index.ejs`,{
title:"Testing",
data:{name:"deepincoding.com"}
});
}
}
export default Controller;
#routers/index.ts
import { Router } from "https://deno.land/x/oak/mod.ts";
import Controller from "../controllers/Controller.ts";
const router = new Router();
router.get("/",Controller.getData);
export default router;
#views/index.ejs
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><%= title %></title>
</head>
<body>
<h2>Hello <%= data.name %></h2>
</body>
</html>
#main.ts
import { Application } from "https://deno.land/x/oak/mod.ts"
import {viewEngine,engineFactory,adapterFactory} from "https://deno.land/x/view_engine/mod.ts";
import router from "./routers/index.ts";
const ejsEngine = engineFactory.getEjsEngine();
const oakAdapter = adapterFactory.getOakAdapter();
const app = new Application();
app.use(viewEngine(oakAdapter,ejsEngine));
app.use(router.routes());
app.use(router.allowedMethods());
await app.listen({port: 8000 })