`

NodeJS Marko custom tags Quick Reference

 
阅读更多

原创转载请注明出处：http://agilestyle.iteye.com/blog/2354225

 

Prerequisite

http://agilestyle.iteye.com/blog/2354215

 

Project Directory

 

SRC

marko-taglib.json

{
	"tag-dir": "./components"
}

 

src/components/app-hello/template.marko

<div>
	Hello ${data.name}! You have ${data.messageCount} message(s).
</div>

 

src/components/app-hello/index.js

var template = require('./template.marko');

module.exports = function(input, out) {
	var name = input.name;
	var messageCount = input.messageCount;

	if(name) {
		name = name.toUpperCase();
	} else {
		name = 'annoymous';
	}

	template.render({
		name: name,
		messageCount: messageCount
	}, out);
}

 

src/pages/home/template.marko

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Marko Demo</title>
</head>
<body>
	<h1>Marko Demo</h1>

	Hello ${data.name}

	<ul if(data.colors)>
        <li for(color in data.colors)>
            ${color}
        </li>
    </ul>
    <div else>
        No colors!
    </div>

    <app-hello name="Marko" message-count="30"/>
    <app-hello message-count="1"/>
</body>
</html>

 

Run & Test


 

marko-tag.json


 

src/components/app-hello目录下新建一个marko-tag.json文件


 

src/pages/home/template.marko新增一行如下：

<app-hello invalid="error" />

 

启动Server，会直接报错如下：


 

Reference

https://www.youtube.com/watch?v=00xBpj89AkY 

 

  • 大小: 5 KB
  • 大小: 30.8 KB
  • 大小: 135.8 KB
  • 大小: 15.6 KB
  • 大小: 61.4 KB
分享到：
| NodeJS Marko Quick Reference
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics