title: rerender view when model property change in EmberJS
body: <p>I'm trying to develop a small app using EmberJS and HighchartJS, and I have some problem to re-render the the HighChartJS after the Model property has changed. This is <a href="http://www.loancomparison.com.s3-website-us-east-1.amazonaws.com/" rel="nofollow">http://www.loancomparison.com.s3-website-us-east-1.amazonaws.com/</a></p>
  
  <pre><code>App.Loan = DS.Model.extend({
      name : DS.attr('string'),
      principal : DS.attr('number'),
      interest_rate : DS.attr('number'),
      months_to_pay : DS.attr('number')
  });
  
  App.LoansView = Ember.View.extend({
      templateName: "loans",
  
      loansChanged: function() {
          //this.rerender();
          Ember.run.scheduleOnce('afterRender', this, 'propertyChanged');
      }.observes('controller.@each.principal', 'controller.@each.name', 'controller.@each.interest_rate', 'controller.@each.months_to_pay'),
  
      propertyChanged : function() {
         console.log("property changed");
         this.loadHighChart(); // This will load the highchart function.
      },
  });
  </code></pre>
  
  <p>What I want is to notify the view whenever the model property <strong>finishes</strong> their change. However, when using observes, it notify the view when the model starts to change. This causes the scheduleOnce to run at the initial state of model property change only.</p>
  
  <p><strong>Edit: Resolved</strong>
  The solution for this turned out to be very simple that I just need to create a "modified" property under the model loan. Then whenever the edit is made, I update this model. Now the view just need to observe the change of this "modified" property.</p>