Reputation: 2465
I have a model data that is in hierarchical order. I am using a component to render the model data and another component to add data to the model. I am facing a problem where when I add a model data in root level, it renders correctly but when I try to add model data one level deep, the view doesn't get updated.
Here is a simple example that demonstrates my problem: http://jsbin.com/UhIdoxOR/1/
So if I add a question after root level question, the view gets updated. But if I try to add a question in child level then the view does not get updated. What can I do to make the appropriate component re-render when the model changes?
Thanks, Dee
Upvotes: 0
Views: 1057
Reputation: 19128
In your QuestionController
you have the hasChildren
and childQuestions
computed properties with property('questions')
, but this is incorrect because hasChildren
depends of childQuestions.length
and childQuestion
of [email protected]
because of the filter. So you need to update to the following:
App.QuestionController = Ember.ObjectController.extend({
needs: 'questions',
questions: Ember.computed.alias("controllers.questions"),
hasChildren: function () {
return (this.get('childQuestions.length') > 0);
}.property('childQuestions.length'),
childQuestions: function () {
return (this.get('questions').filterBy('parentQuestionId', parseInt(this.get('id'))));
}.property('[email protected]')
});
Here is your updated jsbin http://jsbin.com/UhIdoxOR/3/edit
Upvotes: 1