模型中的骨干集合+使用Node.js的宁静服务器devise

我试图开发一个简单的文件浏览器使用Backbone的客户端和Node.js的服务器。 目前我很困扰如何devise模型，当涉及到子文件夹

客户端代码看起来像

app.MyFile = Backbone.Model.extend({ defaults: { path: '', // id of the model will be the path + filename content: '', // content of the file isDir: false // if file is a directory } }); var MyFileList = Backbone.Collection.extend({ model: app.MyFile, url: '/api/files' }); // create global collection of files app.MyFiles = new MyFileList(); // displays file name var MyFileItemView = Backbone.View.extend({ events: { 'click .clickable': 'view' }, ... view: function (source) { if (this.model.toJSON().isDir) { this.model.fetch(); // XXX what to do here _.each(this.model.get('content'), function (obj) { console.log(obj.toJSON()); // error - no toJSON method }); } else { // calls another view that calls the model.fetch // to display the content (no issue here) } }, }); var MyFilesListView = Backbone.View.extend({ initialize: function () { // XXX Not sure if I should listen on MyFiles collection... app.MyFiles.on('reset', this.render, this); }, render: function () { app.MyFiles.each(function (file) { new MyFileItemView({model:file}); }, this); }); app.AppView = Backbone.View.extend({ initialize: function () { // fetch all files app.MyFileList.fetch(); } }); // app.js (point of entry) $(function() { // Kick things off by creating the **App**. new app.AppView(); }); 

我的服务器代码：

 var express = require("express"), ... app.get('/api/files', function(req, res) { ... // return file list (including folder - no issue here) } app.get('/api/files/:id', function(req, res) { var fileModel = createFileModel(req.params.id); // create file model if (!fileModel.isDir) { // if file is not directory, then simply read the content and return // it back to the client -- no issue ... } else { var files = []; // read the directory to find all the files and push it to // files array ... fileModel.content = files; res.send(fileModel); } } 

目前我不确定什么是正确的方法来做到这一点。 我的问题：

1. 如何表示模型对象本身。 如果isDir===true我应该只是将内容设置为MyFile的集合？ 如果是这样的话，我该怎么做？ 在模型的内容上调用toJSON()会抛出exception，因为未定义toJSON
2. 还应该在MyFilesListView听全局集合吗？ 现在我需要处理子文件夹，这似乎不正确。
3. 或者当我试图查看子文件夹时是否应该覆盖全局集合？
4. 我的服务器代码实现是否正确？ 我现在遇到的问题是，当我把内容放入数组并将fileModel发送回客户端时，文件列表不会反映到模型本身中 – 也许我必须重写parse ？

我在这里看了一些post

• Backbone.js框架中的相同“类”的嵌套模型？
• 主干：从服务器获取集合
• 如何从嵌套的JSON与Backbone.js构build一个集合/模型

但我仍然不知道如何应用它… Javascript是困惑:(

Answer 1

你可以在模型中用一个简单的函数写一个简单的模型（你可以称之为xfile模型！）：

  loadFolders : function() { if (this.get('isDir')) { var self = this; self.subFolders = []; _.each(self.get('files'), function(data) { file = new File(data); self.subFolders.push(file); }); } } 

并在您的视图模型中执行相同的操作来呈现正确的树视图。

而在你的express.js后端（我不熟悉这个框架），你只要发送适当的JSON到你的骨干模型。

如果你的数据太长，你想单独获取每个模型目录（当用户在你的视图中展开文件夹时），你可以用同样的想法创build一个有很多集合的模型（或者有很多集合的集合），然后从服务器，后端必须支持目录，如下所示：/api/file/folder1/folder2/file1.txt

另一种更神奇的方法是使用关系模型（通过提供这种function的任何骨干扩展）

如果你想阅读更多关于：

一个marionette.js例子也是这样做的

Backbone.Relational – bakcbone的关系扩展

PS：我不能提供更多的链接，所以你可以searchBackbone.associate，这是骨干的另一个关系扩展

PS 2：你可以使用coffeescript，它的JavaScript语法更简单，更具可读性。