2012-02-28 14 views
3

私はtodoの例で自分のプロジェクトにbackbone.jsを採用しようとしました。私のapp.jsファイルで私は私のビュー/モデル/コレクションなどをインスタンス化しようとするが、私はエラーメッセージを取得しようとする:appは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

準備が整う前に名前空間を使用しようとしています。 2つのオプション。最初に、 'app.js'を最初に持っていますが、初期化コードを取り出し、絶対に最後にロードされた 'bootstrap.js'に入れてください。 2番目のオプションと、私が一般的によく使うものは、ファイルに必要な名前空間がまだ存在しない場合に定義します。たとえば、

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

基本的に、コードは1つずつ読み込まれています。 namespace.subspaceと言うと、コードは名前空間が既に何かと定義されていることを期待しています。そのベースピースがなければ、コードはちょうどフラットラインになります。屋根で始まる城を建てるのと同じことをしようとしていると仮定します。

関連する問題