灰烬ContainerView不更新计算的属性

Question

我试图使一个ContainerView具有childViews计算属性，这取决于控制器。 问题是，当控制器的内容更改时，属性不会更新（当另一个从属属性更改时，属性也不会更新）。 请告诉我我在做什么错...

示例： 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>

Answer 1

这是一个（有效的）改进版本： http : //jsfiddle.net/MikeAski/Qg3uW/

编辑

与您的有趣的细微差别... :-)

• 使用CollectionView代替each助手，
• 使用toggleProperty进行布尔切换，
• 等等

Answer 2

由于ContainerView，该示例似乎无法正常运行。 当我稍作改动时： http : //jsfiddle.net/frZ3a/18/

并将视图更改为常规Ember.View，并将content属性绑定到控制器的内容，它开始正常工作。 我猜这是由于Ember.ContainerView的实现不同。