Ember-Ansicht wird nicht aktualisiert nach der erneuten Bestellung array zum erstellen von untergeordneten Ansichten

Habe ich eine Tätigkeit ansehen, die enthält eine Reihe von Aktivitäten. Dieses array wird sortiert, manchmal basierend auf einer berechneten Eigenschaft(distanced_from_home), die der Benutzer aktualisieren kann. Wenn das array sortiert ist, möchte ich das Kind Ansichten neu gerendert, indem nach der neuen Ordnung. Hier ist meine Vorlage und Ansicht:

index.html

  <script type="text/x-handlebars" data-template-name="activities">
    <h1>Activities</h1>
    {{#each activities}}
      {{view App.ActivityView activityBinding="this"}}
    {{/each}}
  </script>

app.js

  App.ActivitiesView = Em.View.extend({
    templateName: 'activities',
    activities: (function() {
      var list;
      list = App.activityController.activities;
      console.log("Activities View");
      console.log(list);
      return list;
    }).property('App.activityController.activities', '[email protected]_to_home').cacheable()
  });

Wenn ich die distance_to_home Eigenschaft zu ändern, die Konsole.log-Ausgabe zeigt die Liste array richtig sortiert, aber die Kinder Ansichten sind nicht neu gerendert, in der neuen Ordnung. Wenn ich die Ansicht verlassen und dann comeback (es ist erneut gerendert), dann ist die richtige Reihenfolge gezeigt.

Was sollte ich tun, um die Ansicht zu aktualisieren automatisch?

Dank,

BEARBEITEN

Diese scheint zu funktionieren hier und meine 'Aktivitäten' berechnete Funktion ist definitiv brennen, aber keine Neuordnung der Ansicht... ich habe auch versucht, ein Beobachter, aber die Ergebnisse sind die gleichen.

  App.ActivitiesView = Em.View.extend({
    templateName: 'activities',
    classNames: ['activities rounded shadow'],
    homeBinding: 'App.user.home',
    activities: [],
    homeChanged: (function() {
      console.log("homeChanged()");
      this.set('activities', App.activityController.activities.sort(this.compare_activities));
      return null;
    }).observes('home'),

    compare_activities: function(a, b) {
      var result;
      result = 0;
      if (App.user.home != null) {
        result = a.get('distance_to_home') - b.get('distance_to_home');
      }
      return result;
    },

  });

Ich habe auch versucht, um die 'Aktivitäten' - parameter ein leeres array und dann setzen Sie es auf die bestellten array zu zwingen, es neu zu Rendern, aber das hat keine Wirkung.

  App.ActivitiesView = Em.View.extend({
    templateName: 'activities',
    classNames: ['activities rounded shadow'],
    homeBinding: 'App.user.home',
    activities: [],
    homeChanged: (function() {
      console.log("homeChanged()");
      this.set('activities', []);
      this.set('activities', App.activityController.activities.sort(this.compare_activities));
      return null;
    }).observes('home'),

    compare_activities: function(a, b) {
      var result;
      result = 0;
      if (App.user.home != null) {
        result = a.get('distance_to_home') - b.get('distance_to_home');
      }
      return result;
    },

  });

EDIT (die zweite)

So scheint es, dass die Verwendung von Ember.kopieren Sie endlich dies Problem gelöst. Einstellung der array-Eigenschaft auf einen leeren array ein (oder null) hatte keinen Effekt. Hier ist der code Anzeigen, dass endlich gearbeitet:

  App.ActivitiesView = Em.View.extend({
    templateName: 'activities',
    classNames: ['activities rounded shadow'],
    homeBinding: 'App.user.home',
    activities: [],
    homeChanged: (function() {
      var list;
      list = App.activityController.activities.sort(this.compare_activities);
      this.set('activities', Ember.copy(list), true);
      return null;
    }).observes('home'),
    compare_activities: function(a, b) {
      var result;
      result = 0;
      if (App.user.home != null) {
        result = a.get('distance_to_home') - b.get('distance_to_home');
      }
      return result;
    }
  });