У меня есть представление действий, которое содержит массив действий. Этот массив сортируется иногда на основе вычисленного свойства (distanced_from_home), которое пользователь может обновить. Когда массив отсортирован, я хочу, чтобы дочерние представления были повторно отображены в соответствии с новым порядком. Вот мой шаблон и вид:
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()
});
Когда я вызываю свойство distance_to_home для изменения, вывод console.log показывает, что массив списка правильно отсортирован, но представления детей не повторно отображаются в новом порядке. Если я оставлю это представление, а затем вернусь к нему (он снова отображается), то отображается правильный порядок.
Что делать, чтобы автоматически обновлять представление?
Спасибо,
ИЗМЕНИТЬ
Это, кажется, работает здесь, и моя "активная" функция вычисляет определенную стрельбу, но не переупорядочивает представление... Я также пытался использовать наблюдатель, но результаты одинаковы.
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;
},
});
Я также попытался установить параметр "activity" в пустой массив, а затем reset его в упорядоченный массив, чтобы заставить его повторно отобразить, но это не имеет никакого эффекта.
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 (второй)
Итак, похоже, что использование Ember.copy, наконец, решило это. Установка свойства массива в пустой массив (или null) не имела никакого эффекта. Вот код, который наконец-то работал:
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;
}
});