Ember.js v0.9.7
by krisselden
HTML
<script src="https://github.com/downloads/emberjs/ember.js/ember-0.9.7.js"></script>
<script type="text/x-handlebars" >
{{#each App.log}}<p>{{this}}</p>{{/each}}
</script>
JavaScript
App = Ember.Application.create({});
App.log = [];
function log(m) {
App.log.pushObject(String(m));
}
var set = Ember.set;
var prototype = {
name: 'foo'
};
Ember.addObserver(prototype, 'name', function () {
log('changed prototype.name: ' + prototype.name);
});
// Like Object.create but calls Ember.rewatch too
var a = Ember.create(prototype);
var b = Ember.create(prototype);
Ember.addObserver(a, 'name', function () {
log('changed a.name: ' + a.name);
});
Ember.addObserver(b, 'name', function () {
log('changed b.name: ' + b.name);
});
log('prototype.name: '+ prototype.name);
log('a.name: '+ a.name);
log('b.name: '+ b.name);
// shouldn't cause name:change in all since all of them will reflect the change?
set(prototype, 'name', 'bar');
log('prototype.name: '+ prototype.name);
log('a.name: '+ a.name);
log('b.name: '+ b.name);
// should only name:change for a but causes it in prototype which didn't change
set(a, 'name', 'baz');
log('prototype.name: '+ prototype.name);
log('a.name: '+ a.name);
log('b.name: '+ b.name);
// should only name:change for a but causes it in prototype which didn't change
set(b, 'name', 'boo');
log('prototype.name: '+ prototype.name);
log('a.name: '+ a.name);
log('b.name: '+ b.name);