「ページコンテンツ」エリアとメインナビゲーションリンクを備えた1ページのWebサイトを構築しています。リンクをクリックすると、アニメーションが実行され、コンテンツ（およびhtml）が「ページコンテンツ」領域に読み込まれます。
私はMVCを十分に理解していますが、javascriptMVCフレームワークのコンテキストでは、アプリケーションの設計に少し問題があります。今後はJavaScript（およびJavaScriptアニメーション）をたくさん追加する予定なので、自分のサイトに優れた基盤を提供したいと思います。
追加したいデータ（およびhtml）を含むフィクスチャを含む1つのモデル（インデックス）がありますか？
アクション（アニメーション、フィクスチャからのデータロード）を備えたページ（インデックス）用のコントローラーは1つありますか？
各リンクをアクションにポイントするにはどうすればよいですか？
基本的に、 javascriptMVCフレームワークを使用してページを概念的に設計するにはどうすればよいですか？
私は実際に、iPhone 用に構築している PhoneGap アプリケーションに対して非常によく似た処理を行っています。これは、1 ページの JavaScript アプリケーションです。私が使用している基本的なアーキテクチャは次のとおりです。
すべてのページ変更は通常の<a href="/stuff/things/"></a>タグで行われます。href は「有効な」href - 「/stuff/things/」です。
URL 正規表現をコントローラーにマップするオブジェクトがあります。/recipes/\d+?//recipes/10/ や /recipes/5/ などの URL をキャプチャして、指定されたコントローラーを呼び出します。
リンクのクリックをチェックするイベントをドキュメントにバインドし、リンクの href 属性をさまざまな正規表現でチェックします。一致する場合は、「ページ変更」が開始されます。
pagechange 関数を使用history.pushState()して URL を変更し、事前設定されたデータ オブジェクトをコントローラーに渡します。そのデータ オブジェクトの一部は匿名の「完全な」関数であり、処理が完了するとコントローラー自体が使用します。
"complete" 関数で渡される理由は、多くの場合、ページの変更に ajax を使用したデータベースへのクエリなどの非同期アクティビティが含まれているためです。また、「ページ変更」動作をコードの 1 つのセクションに保持することもでき、コントローラーは効果的に html のブロックを構築して DOM に追加するだけです。その時点で、コントローラーは渡された complete() 関数を呼び出し、pagechange 関数はその作業を終了します。
私のフレームワーク全体は、http: //eatery.decoratelife.net/eatery.jsで見ることができます。
「真の」MVC ではありません。私は実際にはモデルやビューを持っていないので。ビューは、データ オブジェクトを Mustache JS と同様の HTML テンプレート文字列とマージすることによって処理され、モデルはリモート mongoDB への API 呼び出しによって実行されます。しかし、それはあなたの問題を解決するための適切な方法を示していると思います.