zoukankan      html  css  js  c++  java
  • art-template实例(超详细)

    效果展示

    首先下载模板引擎,在需要下载的地方打开命令行工具,输入

    npm install atr-template --save
    

    下载模板引擎后会出现文件夹 node_modules

    下载完成之后就可以开始代码,需要一个js文件和一个html文件,html用来存储模板

    js代码app.js

    var http = require('http')
    var fs = require('fs')
    var template = require('art-template')
    http
    	.createServer(function(req, res) {
    		var url = req.url
    		if (url === '/') {
    			//读取文件的模板内容,
    			fs.readFile('./index.html', function(err, data) {
    				if (err) {
    					return res.end('404')
    				}
    				//默认读取到的data是二进制数据,模板引擎的render接收的是字符串,需要data转toString
    				var ret = template.render(data.toString(), {
                                            //里面可以更改对应的值
    					name:'fur',
    					age:18,
    					province:'广州',
    					hobbies:[
    						'打代码',
    						'吃零食'
    					]
    				})
    				res.end(ret)
    			})
    		}
    	})
    	.listen(3000, function() {
    		console.log('runing')
    	})
    
    

    html代码index.js

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<title></title>
    	</head>
    	<body>
    		<p>我叫{{ name }}</p>
    		<p>我{{ age }}岁</p>
    		<p>我来自{{ province }}</p>
                    //这里有个循环输出
    		<p>我喜欢{{ each hobbies }} {{ $value }} {{/each}}</p>
    	</body>
    </html>
    
    

    两个文件都ok就可以打开控制台到当前目录,使用 node app.js
    即可看到运行结果 控制台输出runing即成功,然后打开浏览器输入

    效果展示

  • 相关阅读:
    .net framework v4.5.2
    sql数据库不允许保存更改和保存失败解决方法
    如何查看笔记本电脑型号
    Premiere 5.0/5 .5菜单详解
    Python编辑器英文菜单的中文翻译及解释
    SqlServer--常用数据查询
    pycharm上方菜单栏不见了如何恢复
    笔记本电脑的f1到f12怎么按
    C#的访问权限
    封装,继承和多态知识点汇总
  • 原文地址:https://www.cnblogs.com/furfur-jiang/p/11393107.html
Copyright © 2011-2022 走看看