ドライブ、そのフォルダー、およびファイルを表示する基本的なアプリを試みています (ダイブ hasMany フォルダー hasMany ファイル) ... ハンドルバー テンプレートを使用して実装すると、すべての関係が正常に読み込まれますが、コントローラーとビューを手動で作成すると、いくつかの問題が発生しました。ビューを手動でインスタンス化した理由は次のとおりです。要件の 1 つは、ファイル モデルの属性「タイプ」に基づいて、ファイル オブジェクトの別のビュー (および場合によってはコントローラー) を読み込むことです (たとえば、画像ファイルには App.ImageFileView が必要で、動画には App.VideoFileView が必要です)。また、別の要件として、ルーティングはドライブ専用であるため、フォルダーやファイル ルートがあってはなりません。私が直面している主な問題は、現在のドライブに関連するフォルダーが正常に読み込まれることです。しかし、フォルダーを反復して関連ファイルをロードすると、常に空のセットが得られます。助けていただければ幸いです。私の質問は、ハンドルバー テンプレートを使用しているときにファイルが表示されるのに、コントローラーとビューを手動でインスタンス化したときに表示されないのはなぜですか? また、関係を強制的にロードするにはどうすればよいですか?
フィドルはここにあります
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
},
];