DataType
/
omi
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

template polyfill

This commit is contained in:
kmdjs 2016-05-04 08:18:03 +08:00
parent eaf39adc44
commit b5cf1c9579
4 changed files with 48 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
dist/nuclear.js vendored
View File

@ -1132,6 +1132,7 @@ Nuclear.Class.extend = function (prop) {
document.head.appendChild(style);
//先隐藏所有dom元素
style.sheet.insertRule("body { visibility: hidden; }", 0);
style.sheet.insertRule("template { display: none !important; }", 0);
}
function scoper(css, prefix) {

2
dist/nuclear.min.js vendored
View File

File diff suppressed because one or more lines are too long

45
example/template.html Normal file
View File

@ -0,0 +1,45 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Nuclear</title>
</head>
<body>
<template id="myTemplate">
<style scoped>
h3 { color:red; }
button{ color:green;}
</style>
<div>
<div>
<h3>TODO</h3>
<ul>{{#items}}<li>{{.}}</li>{{/items}}</ul>
<form onsubmit="add(event)">
<input nc-id="textBox" type="text">
<button>Add #{{items.length}}</button>
</form>
</div>
</div>
</template>
<div id="todoListContainer"></div>
<script src="http://alloyteam.github.io/Nuclear/js/nuclear.min.js"></script>
<script>
var todoTpl = document.querySelector("#myTemplate").innerHTML;
var TodoApp = Nuclear.create({
add: function (evt) {
evt.preventDefault();
this.option.items.push(this.textBox.value);
},
render: function () {
return todoTpl;
}
});
new TodoApp({ items: [] }, "#todoListContainer");
</script>
</body>
</html>

1
src/scoper.js
View File

@ -7,6 +7,7 @@
document.head.appendChild(style);
//先隐藏所有dom元素
style.sheet.insertRule("body { visibility: hidden; }", 0);
style.sheet.insertRule("template { display: none !important; }", 0);
}
function scoper(css, prefix) {