JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://cloud.github.com/downloads/emberjs/ember.js/ember-latest.js"></script>
<script type="text/x-handlebars">
{{#view App.HelloView}}
{{view Ember.TextField viewName="firstName" placeholder="first name"}}
{{view Ember.TextField viewName="lastName" placeholder="last name"}}
<button {{action "hello"}}>Say Hello</button>
{{/view}}
{{#view App.BoundView}}
{{#with person}}
{{view Ember.TextField valueBinding="firstName"}}
{{view Ember.TextField valueBinding="lastName"}}
{{/with}}
<button {{action "hello"}}>Say Hello</button>
{{/view}}
</script>
JavaScript
App = Ember.Application.create()
App.HelloView = Ember.View.extend({
hello: function() {
alert("Hello " + this.get('firstName').get('value') + " " + this.get('lastName').get('value'));
}
});
App.Person = Ember.Object.create({
'firstName': 'John',
'lastName': 'Doe',
fullName: function() {
return this.get('firstName') + ' ' + this.get('lastName');
}.property('firstName', 'lastName')
});
App.BoundView = Ember.View.extend({
personBinding: 'App.Person',
hello: function() {
alert("hello " + this.get('person').get('fullName'));
}
})