Ember Latest
The latest build of Ember.
HTML
<script src="http://builds.emberjs.com/handlebars-1.0.0.js"></script>
<script src="http://builds.emberjs.com/ember-latest.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.7.0/underscore.js"></script>
<script type="text/x-handlebars" data-template-name="application">
<h1>ember-latest jsfiddle</h1>
{{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="index">
<h2>Index Content:</h2>
<button {{action 'generate'}}>Generate</button>
{{newSnakeMorph}}
</script>
CSS
h1 { font-size: 1.6em; padding-bottom: 10px; }
h2 { font-size: 1.4em; }
ul { padding: 15px; font-size: 1.4em; color: green; }
JavaScript
App = Ember.Application.create({});
App.IndexRoute = Ember.Route.extend({
model: function(){
return Ember.Object.create({
newSnakeGenes: Em.A([])
});
}
});
App.IndexController = Ember.ObjectController.extend({
actions: {
generate: function() {
this.get('model.newSnakeGenes').pushObject({
morph: 'gene' + Math.round(Math.random(100)*100)
});
}
},
newSnakeMorph: function() {
if (this.get('model.newSnakeGenes.length'))
{
var genes = this.get('model.newSnakeGenes');
return genes.map(function (gene) {
return Ember.get(gene, 'morph') ;
}).join(', ');
}
else
{
return "Normal";
}
}.property('model.newSnakeGenes.[]')
});