2013-12-17 13 views
30

私はangularJSを新しくしました。私はangularJSを使用してphonegapアプリケーションを構築することができました。アプリは大丈夫で、うまく動作しています。問題は、angularJSがどのように機能しているか(少なくとも私が持っていると思うこと)をもう少し理解したところで、私のアプリケーションファイルの構造とコードの保守性が心配です。私のプロジェクトは角種パターンに従います。私はこのような構造を持っているAngular Seed on GitHubは:AngularJS App:index.htmlに.jsファイルを含める方法

js 
    app.js 
    controllers.js 
    directives.js 
    services.js 
    filters.js 

はangularJSでアプリケーションを構築する方法を研究した後、私はそれについていくつかの非常に素晴らしい記事を見つけた:Building Huuuuuge Apps with AngularJSHOW TO STRUCTURE LARGE ANGULARJS APPLICATIONS

私の質問は私が、私には非常に愚かなようです道を見つけることができませんでした。私は別のファイルに私のコントローラを分離するために管理し、私は今、このような構造を持っている:

scripts 
    controllers 
      LoginCtrl.js 
      HomeCtrl.js 
      AboutCtrl.js 
      ClientCtrl.js 

私は苦労してる事は私のアプリを前にしたような方法で、私は一つだけcontroller.jsファイルを持っていたということです。私のindex.htmlファイルでは、通常、scriptタグを使ってすべてのスクリプトファイルをロードします。これで私のコントローラ用に4つの異なる.jsファイルが作成されました。どのようにindex.htmlファイルにロードするのですか?そこにすべてをロードする必要がありますか?

このようなindex.htmlファイル内のすべてのスクリプトを読み込むのは正しくありません(同じファイルを読み込むと、同じコードが読み込まれることがわかります。タグがそこに詰め込まれている)。私はgithub上でng-boilerplateプロジェクトを見つけましたが、index.htmlでは動的にスクリプトを読み込んでいます。問題は、私は今、新しいng-bolierplateを開始することができず、私は彼らがそれをやった方法を見つけることができなかったということです。長いテキストを申し訳ありません。ありがとう!

+0

[複数ファイルのAngularJS規則]の複製が可能です。(http://stackoverflow.com/questions/18241143/angularjs-convention-for-multiple-files) – Stewie

+1

私は以前にはいやがらせをしたことがありません。私のプロジェクトはインストールされておらず、私はphonegapプロジェクトですので、どうやってそれを行うのが本当に混乱しています。 – jpgrassi

答えて

12

index.html内の独自のタグで各スクリプトファイルを参照することは間違いなく最も簡単な方法です。あなたはきれいな何かをしたい場合は、RequireJSと角度の組み合わせに様々なガイドの一つを見てみましょう:

http://www.startersquad.com/blog/angularjs-requirejs/

Does it make sense to use Require.js with Angular.js?

このアプローチは、主にどのような順序の問題を解決することを目的とします依存関係を満たすためにファイルをロードしますが、index.htmlをクリーンアップした結果もありますが、他の場所での追加設定を犠牲にしています。

+0

ありがとう、最初の記事は私がそれがどのように動作するかを理解するのに役立ちました。私たちのプロジェクトは稼動しているので、私はそれを使うことを考えていますが、私は今大きな変更をしたくありません。 – jpgrassi

3

使用http://browserify.org/

あなたは、あなたのブラウザーでのNode.jsから非常にシンプルかつエレガントcommonjs modulesと素晴らしいライブラリの多くを得ます。

コードは、単一のjsファイルにバンドルされます。

関連する問題