Ember js和多层关系

时间:2013-03-28 12:58:57

标签: ember.js ember-data

我正在尝试显示驱动器,其文件夹和文件的基本应用程序(潜水有多个文件夹有多个文件)...当使用车把模板实现时,所有关系都可以正常加载但是当我手动创建控制器和视图时,我遇到了一些的问题。我手动实例化视图的原因如下。一个要求是基于文件模型上的属性“type”为文件对象加载不同的视图(可能还有控制器)(例如,图像文件应该有App.ImageFileView,视频有App.VideoFileView)。另一个要求是路由只适用于驱动器,因此不应该有文件夹或文件路由。我面临的主要问题是与当前驱动器相关的文件夹加载正常。但是当我迭代一个文件夹加载相关文件时,我总是得到一个空集,任何帮助都表示赞赏。所以我的问题是为什么在使用把手模板时显示文件,而不是在手动实例化控制器和视图时显示?我怎样才能强制加载关系呢?

小提琴位于here

App = Ember.Application.create({});

// routing
App.Router.map(function() {
    this.resource('drives',{path:'/'});
    this.resource('drive',{path:'/:drive_id'});
});
App.DrivesRoute = Ember.Route.extend({
  model: function() {
    return App.Drive.find();
  }
});
App.DriveRoute = Ember.Route.extend({
  model: function(params) {
    rval = App.Drive.find(params.drive_id);

    App.set('activeDrive',rval);
    return rval;
  },
  setupController : function(controller, model){
  debugger;
    var rController = App.DrivesController.create({content:model.get('folders')});
    rController.populate();
  }
});


// controllers
App.DrivesController = Ember.ArrayController.extend({
    populate : function(){
        var drives = this.content;
        debugger;
        drives.forEach(function(drive){
            var rc = App.DriveController.create({content:drive});

            rc.populate();
            var rv = App.DriveView.create({controller:rc});
            rv.prepare().append('#output');
        });
    }
})
App.DriveController = Ember.ObjectController.extend({
    populate:function(){
        console.log('There are '+this.content.get('files.length')+' files');
        this.content.get('files').forEach(function(file){
            // not reaching this point ... files.length is always 0
        });
    }
});


// views 

App.DriveView = Ember.View.extend({
    template : Ember.Handlebars.compile('{{content.name}}'),
    prepare:function(){
        return this;
    }
});

//Models

App.Store = DS.Store.extend({
  revision: 11,
  adapter: DS.FixtureAdapter.create({simulateRemoteResponse: false})
});
App.Drive = DS.Model.extend({
    title : DS.attr('string'),
    folders : DS.hasMany('App.Folder')
});
App.Folder = DS.Model.extend({
    name : DS.attr('string'),
    drive : DS.belongsTo('App.Drive'),
    files : DS.hasMany('App.File')
});
App.File = DS.Model.extend({
    content : DS.attr('string'),
    type : DS.attr('string'),
    folder : DS.belongsTo('App.Folder')
});

// Fixtures
App.Drive.FIXTURES = [
    {
        id:1,
        title : 'First Drive Title',
        folders : [11,12,13]
        },
    {
        id:2,
        title: 'Second Drive Title'
    },
    {
        id:3,
        title: 'Third Drive Title'
    }
];
App.Folder.FIXTURES = [
    {
        id:11,
        name:"Docs",
        files : [111,112]
    },
    {
        id:12,
        name:"Downloads"
    },
    {
        id:13,
        name:"Music"
    },
];
App.File.FIXTURES = [
    {
        id :111,
        content : 'first file content',
        type : 'Text',
        folder: 11
    },
    {
        id :112,
        content : 'second file content',
        type : 'Image',
        folder:11
    },

];

1 个答案:

答案 0 :(得分:0)

嗯,我对灯具知之甚少,但你的问题可能与widgets : [111,112]而不是App.Folder.FIXTURES files : [111,112]有关吗? 此外,您的文件夹似乎没有任何驱动器ID。但我不知道这些是否明确是必要的。