コントローラに依存するchildViews計算プロパティを使用してContainerViewを作成しようとしています。問題は、コントローラーのコンテンツが変更されてもプロパティが更新されないことです（別の依存プロパティが変更されてもプロパティは更新されません）。何が間違っているのか教えてください...
例： http： //jsfiddle.net/frZ3a/5/
Javascript：
App = Em.Application.create({});
App.controller = Em.ArrayController.create({
reversed: false,
content: [],
init: function() {
var c = this;
function addContent() {
if (c.get('content').length < 10) {
c.get('content').push(c.get('content').length);
setTimeout(addContent, 1000);
console.log(c.get('content'));
}
}
addContent();
return this._super();
}
});
App.TestView = Em.View.extend({
templateName: 'single',
number: null
})
Em.ContainerView.create({
templateName: 'test',
tagName: 'div',
controller: App.controller,
reversedBinding: 'controller.reversed',
childViews: function() {
var result = this.get('controller.content').map(function(el) {
return App.TestView.extend({number: el});
});
if (this.get('reversed')) {
result.reverse();
}
return result;
}.property('controller.content.@each', 'reversed')
}).append();
Em.View.create({
templateName: 'reverse',
controller: App.controller,
reversedBinding: 'controller.reversed',
reverseContent: function() {
this.set('reversed', !this.get('reversed'));
}
}).append();
HTML：
<script type="text/x-handlebars" data-template-name="single">
Single view: {{view.number}}
</script>
<script type="text/x-handlebars" data-template-name="reverse">
<a {{action reverseContent}}>Reverse</a>
</script>
</ p>