art-template-node

Author: csxiaoyaojianxian

04-常用功能/04-js模板引擎/artTemplate/03-artTemplate基本使用demo.html renamed to 04-常用功能/04-js模板引擎/artTemplate/03-artTemplate浏览器版本/artTemplate基本使用demo.html

@@ -0,0 +1,25 @@
+<script src="./template-web.js"></script>
+
+<div id="content"></div>
+
+<script id="test" type="text/html">
+{{if isAdmin}}
+<h1>{{title}}</h1>
+<ul>
+    {{each list value i}}
+        <li>索引 {{i + 1}} ：{{value}}</li>
+    {{/each}}
+</ul>
+{{/if}}
+{{$data}}
+</script>
+
+<script>
+var data = {
+    title: '基本例子',
+    isAdmin: true,
+    list: ['文艺', '博客', '摄影', '电影', '民谣', '旅行', '吉他']
+};
+var html = template('test', data);
+document.getElementById('content').innerHTML = html;
+</script>

04-常用功能/04-js模板引擎/artTemplate/template-native.js renamed to 04-常用功能/04-js模板引擎/artTemplate/03-artTemplate浏览器版本/template-native.js

@@ -0,0 +1,9 @@
+{{if isAdmin}}
+<h1>{{title}}</h1>
+<ul>
+    {{each list value i}}
+        <li>索引 {{i + 1}} ：{{value}}</li>
+    {{/each}}
+</ul>
+{{/if}}
+{{$data}}

04-常用功能/04-js模板引擎/artTemplate/template-web.js renamed to 04-常用功能/04-js模板引擎/artTemplate/03-artTemplate浏览器版本/template-web.js

@@ -0,0 +1,12 @@
+// npm install art-template --save
+// 安装 vscode 相关插件
+
+const path = require('path');
+const template = require('art-template');
+const data = {
+    title: '基本例子',
+    isAdmin: true,
+    list: ['文艺', '博客', '摄影', '电影', '民谣', '旅行', '吉他']
+};
+const html = template(path.resolve(__dirname, 'index.art'), data);
+console.log(html);

04-常用功能/04-js模板引擎/artTemplate/03-artTemplate浏览器版本/浏览器demo.html

@@ -0,0 +1,15 @@
+{
+  "name": "art-template-demo",
+  "version": "1.0.0",
+  "description": "",
+  "main": "main.js",
+  "scripts": {
+    "start": "node main.js",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "art-template": "^4.13.2"
+  }
+}