2012-02-28 31 views
3

我只是尝试使用todo示例对我的项目采用backbone.js。在我的app.js文件中,我尝试实例化我的视图/模型/集合等,但我尝试去获取错误消息:应用程序未在TodoList中定义。不同文件中的模型/视图

HTML:

<head> 

<script type="text/javascript" src="js/json2.js"></script> 
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script> 
<script type="text/javascript" src="js/underscore-min.js"></script> 
<script type="text/javascript" src="js/backbone-min.js"></script> 
<script type="text/javascript" src="js/backbone-localstorage.js"></script> 

<script type="text/javascript" src="js/models/models.js"></script> 
<script type="text/javascript" src="js/collections/collections.js"></script> 
<script type="text/javascript" src="js/views/views.js"></script> 
<script type="text/javascript" src="js/views/app.js"></script> 

<script type="text/javascript" src="js/app.js"></script> 

app.js(根为我的应用):

var app = { 
    models:{}, 
    collections:{}, 
    views:{} 
}; 

    jQuery(function($) { 

     var Todos = new app.collections.TodoList; 
     var test = new Todo; 
     var test2 = new TodoView; 
     var appView = new AppView({}); 

    }); 

collections.js:

app.collections.TodoList = Backbone.Collection.extend({ 

model: Todo, 

localStorage: new Store("todos"), 

done: function() { 
    return this.filter(function(todo) { 
     return todo.get('done'); 
    }); 
}, 

remaining: function() { 
    return this.without.apply(this, this.done()); 
}, 
nextOrder: function() { 
    if (!this.length) return 1; 
    return this.last().get('order') + 1; 
}, 

comparator: function(todo) { 
    return todo.get('order'); 
} 

});

回答

5

您正在尝试在准备好之前使用名称空间。两个选项。首先,先'app.js',但取出初始化代码并将其放入绝对最后加载的'bootstrap.js'中。第二种选择,以及我通常喜欢的选项,如果它们不在那里,则在文件中定义您需要的命名空间。例如

var app = app || {}; 
app.collection = app.collection || {}; 

基本上,代码是一个接一个加载的。当你说namespace.subspace时,代码期望这个名称空间已经被定义为某些东西 - 通常是我见过的大多数情况下的一个对象。如果没有这个基础代码,代码就会变得扁平化 - 它会假设你正在试图从屋顶开始建造一座城堡。

相关问题