Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
<html>
<head>
<script src="javascripts/jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="javascripts/ember.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
App = Ember.Application.extend();
App.Node = Ember.Object.extend({
name: null,
children: []
});
App.tree = App.Node.create({
name: "Node 1",
children: [
App.Node.create({
name: "Node 2",
children: [
App.Node.create({
name: "Leaf 2",
children: []
})
]
}),
App.Node.create({
name: "Leaf 1",
children: []
})
]
});
</script>
<script type='text/x-handlebars' data-template-name='node-template'>
<div>Name: {{content.name}}</div>
<div>
{{#each content.children}}
<div style="margin-left: 18px;">{{view App.NodeView contentBinding="this"}}</div>
{{/each}}
</div>
</script>
<script type="text/javascript" charset="utf-8">
App.NodeView = Ember.View.extend({
templateName: 'node-template'
});
$(function(){
var root = App.NodeView.create({
content: {
name: App.tree.get("name"),
children: App.tree.get("children")
}
});
root.append();
});
</script>
</head>
<body>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment