Embedded Observable Card
It should be easy, but I can't figure it out. I am creating a view that behaves a bit like a tri-state multiple choice, and the main component is a property in the view that lists all the options and its status:
TriState = Ember.View.extend({
...
childView: TristateItem,
selectionStates: {}
});
TristateItem = Ember.View.extend({
...
selectedState: function() {
var value = this.get('value');
var states = this.get('parentView.selectionStates');
var state = states[value];
if (Ember.isNone(state))
return 0;
return state;
}.property('value', 'parentView.selectionStates'),
click: function(event) {
var states = this.get('parentView.selectionStates');
var value = this.get('value');
var newState = states[value];
if (Ember.isNone(newState) || newState == 0)
newState = 1;
else if (newState == 1)
newState = -1;
else
newState = 0;
states[value] = newState;
event.stopPropagation();
}
So after a few clicks the value selectionStates
might be
{0: 1, // value "0" is selected with state "1"
3: -1, // value "3" is selected with state "-1"
4: 0} // value "4" is not selected
This works great, but the value TristateItem.selectedState
doesn't change. I assume this is because it is not possible to observe a javascript object, but I cannot find anything observable in Ember that is equivalent. How can i do this?
+3
source to share