Question

我正在设置一个包含两条路线的主 - 细节界面。父路由包含一个EventSource流，可定期更新其模型。

我正在尝试这样做，当父路线的模型对其任何项目进行更改时，如果当前详细信息视图显示任何已更改的项目，则应更新它。

我正在尝试对receptor路由到receptores的控制器模型进行绑定，并观察：

根据blessenm的建议编辑：

var App = Ember.Application.create({
    rootElement: '#content'
});

App.Router.map(function() {
    this.resource('receptores', {path: '/'}, function() {
        this.resource('receptor', {path: ':user_id'});
    });
});

App.ReceptoresRoute = Ember.Route.extend({
    model: function() {
        var deferredData = Ember.Deferred.create();
        var data = [];
        var sse = new EventSource('/monitoreo/receptores/push');
        sse.addEventListener('update-receptores', function(e) {
            var receptores = JSON.parse(e.data);
            receptores.forEach(function(r) {
                var item = data.findBy('id', r.id);
                if (typeof(item) != 'undefined') {
                    data.replace(data.indexOf(item), 1, [r]);
                } else {
                    data.pushObject(r);
                }
            });
            deferredData.resolve(data);
        });
        sse.addEventListener('ping', function(e) {
            console.log('ping');
        });
        return deferredData;
    }
});

App.ReceptorRoute = Ember.Route.extend({
    model: function(params) {
        return this.modelFor('receptores').findBy('id', params.user_id);
    }
});

App.ReceptorController = Ember.ObjectController.extend({
    needs: ['receptores'],
    parentModelBinding: Ember.Binding.oneWay('controllers.receptores.model'),
    parentModelDidChange: function() { // never fires
        console.log('changed');
        this.set('model', this.modelFor('receptores').findBy('id', this.get('model').user_id));
    }.observes('parentModel')
});

这是我到目前为止所拥有的。发生的事情是parentModelDidChange永远不会触发。使用chrome我检查了receptor的控制器，并且永远不会设置parentModel属性，我将其解释为绑定不起作用。

我有一种感觉，我需要在receptores控制器上设置模型更改而不是它的路径，但是当我尝试以下操作时，我得到异常Assertion Failed: The value that #each loops over must be an Array. You passed <Ember.Deferred:ember338>：

App.ReceptoresRoute = Ember.Route.extend({
    setupController: function(controller) {
        // same as the previous model hook
        ...
        controller.set('model', deferredData);
    }
});

我目前的解决方案。我从receptores路线中取出了EventSource并将其置于全局范围内。从receptor控制器的init挂钩添加了一个事件监听器。

在我看来，这不应该是必要的。应该有一种方法将子控制器的模型绑定到父路径的数组模型中的相应项。该源项目的更改应立即反映在孩子身上，但我想这也取决于应用程序的设计。

var App = Ember.Application.create({
    rootElement: '#content'
});

App.Router.map(function() {
    this.resource('receptores', {path: '/'}, function() {
        this.resource('receptor', {path: ':user_id'});
    });
});

var sse = new EventSource('/monitoreo/receptores/push');

App.ReceptoresRoute = Ember.Route.extend({
    model: function() {
        var deferredData = Ember.Deferred.create();
        var data = [];
        sse.addEventListener('update-receptores', function(e) {
            var receptores = JSON.parse(e.data);
            receptores.forEach(function(r) {
                var item = data.findBy('id', r.id);
                if (typeof(item) != 'undefined') {
                    data.replace(data.indexOf(item), 1, [r]);
                } else {
                    data.pushObject(r);
                }
            });
            deferredData.resolve(data);
        });
        sse.addEventListener('ping', function(e) {
            console.log('ping');
        });
        return deferredData;
    }
});

App.ReceptorRoute = Ember.Route.extend({
    model: function(params) {
        return this.modelFor('receptores').findBy('id', params.user_id);
    }
});

App.ReceptorController = Ember.ObjectController.extend({
    init: function() {
        var self = this;
        sse.addEventListener('update-receptores', function(e) {
            var current_id = self.get('model').id;
            JSON.parse(e.data).forEach(function(r) {
                if (r.id == current_id) {
                    self.set('model', r);
                }
            });
        });
    }
});

EmberJS：观察父路线的模型并相应地改变子路线的模型

0 个答案: