简体   繁体   中英

Ember.js - Call parent model hook to load data for child

I have a master/detail view in Ember. If i am calling the detail page directly, the model hook of the detail page needs the model(data) from the parent(master). The detail model hook is called - whats the proper way to get/call the model so the modelFor function in the detail hook works.

Router:

App.Router.map(function(){
    this.resource('index', { path: '/' } );
    this.resource('devices', { path: '/devices'}, function() {
        this.resource('device', { path: ':imei'});
    });
});

Master Route:

App.DevicesIndexRoute = Ember.Route.extend({
    model: function() {

        var self = this;
        return requestController.get({
            url: "foo/bar/",
            success: function(data) {
                console.log(data);
                return data;
            },
            error: function() {
                console.log("error");
                return [];
            }
        });
    }
});

Detail Route:

    App.DeviceRoute = Ember.Route.extend({
        model: function(args) {
////// Gets Called - needs data from master!!
            var model = this.modelFor('devices.index').findBy('imei', args.imei);
            return model;
        }
    });

Thanks for help

The devices.index route is not the parent route, it's another leaf route. Typically you would define the model on the resource route and then access through the leaf routes:

App.Router.map(function(){
    this.resource('index', { path: '/' } );
    this.resource('devices', { path: '/devices'}, function() {
        this.route('device', { path: ':imei'});
    });
});

Master route:

App.DevicesRoute = Ember.Route.extend({
    model: function() {

        var self = this;
        return requestController.get({
            url: "foo/bar/",
            success: function(data) {
                console.log(data);
                return data;
            },
            error: function() {
                console.log("error");
                return [];
            }
        });
    }
});

Index route: (in future ember versions this will automatically pick up parent's model)

App.DevicesIndexRoute = Ember.Route.extend({
    model: function() {
        this.modelFor('devices');
    }
});

Detail route:

App.DevicesDeviceRoute = Ember.Route.extend({
    model: function(args) {
        var model = this.modelFor('devices').findBy('imei', args.imei);
        return model;
    }
});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM