3

私はAngularJSとJS全般に不慣れです。私は、GWTを使用してクライアント側を実装するために使用したJavaの世界から来ました。

AngularJSに移動すると、次の問題が発生します。

.jsファイルを整理する方法は？javaでは、各クラスに.javaファイルがありますが、このプラクティスがJSで実装されている場合、各クラス（関数）は別々の.jsファイルに存在するため、.jsファイルをフェッチするための多くのhttpリクエストがあります。

また、ファイルは、他のプログラマーがファイル間で割り当ててナビゲートし、これらのファイルが何に関連しているかを読み取って理解できるように編成する必要があります。

4

5 に答える 5

7

残念ながら、これを行う方法は約 100 万通りあります。angular はモジュールを使用し、すべての angular コードはモジュール内にある必要があるため、javascript 名前空間を使用する IMO は、モジュールの名前空間の二次的なものになります。

このプロジェクト ( angular-grunt-coffeescript ) を見てください。この問題を解決するのが私の試みです。私は coffeescript を使用していますが、同じ考え方が .js プロジェクトにも当てはまります。

「angular-seed」プロジェクトを少し拡張して大きなアプリで使用できるようにしようとするangular-sproutもあります - angular-sprout は js にあります。

アップデート

Yeoman は、スケルトン AngularJS プロジェクトを作成するための標準になる可能性があるため、すべての「ホーム」を提供する必要があるようです (個人的にはまだ使用していません)。ここを見てください。

于 2012-11-12T17:30:35.080 に答える
4

For a large project i can recommend using one directory per module, and one file per "thing" (service, value, factory, controller...). Html partials should be stored in each module directory along with their respective directives or controllers.

We have been using this approach for some time, and it is really working out fine. The project is built by maven (Java is used for the backend), and all the js-files are concatenated into one file per angular application plus one file for components shared between angular applications. Check out aggregations in yuicompressor-maven-plugin if you are into maven.

Because we have several js files per module, we needed a way to create a module exactly once, and before we register the "thing" in each js-file.

The solution we came up with was adding a file called 0-module.js in each module directory with the module creation statement. yuicompressor-maven-plugin will add this first to the aggregated file.

Example file structure:

mymodule/
   0-module.js
      >angular.module('mymodule', []); //Create module
   MyController.js
      >angular.module('mymodule').controller("MyController", [... // Register MyController
   myTemplate.html
于 2012-12-12T12:02:45.137 に答える
3

私は通常、コードをその名前空間に関連するクラスを含む名前空間に分割します。各名前空間を別々のJSファイルに入れました。

したがって、LinkedList,BinaryTree,KDTreeetcという名前のクラスがある場合は、それらをDataStructures名前空間にバンドルして、

datastructures.js

したがって、次のように言うことでインスタンス化できます。

var kd = new Datastructures.KDTree();

名前空間名とファイル名を同じに保つことで、名前自体が自己記述型であるため、強力なIDEを必要とせずに実際のコードを簡単に見つけることができます。

お役に立てれば！

于 2012-11-12T15:35:57.580 に答える
2

Yeomanを使用することをお勧めします。開発者もそうしていると思います (彼らはそれをかなり支持しています。彼らの gPlus ページ、または彼らのこのビデオをチェックしてください)。スキャフォールディング ( Angular-Seedの構造に従う)、テスト、JS サーバーを介したライブ プレビュー、および展開が可能です。すべての .js ファイルを連結し、複数のリクエストの問題を回避します。見てみな！

于 2012-11-13T20:59:49.623 に答える
0

この質問が少し前に発生したことを認めて、今日それを尋ねている人のために、ファイル構造を含む Angular を使用するさまざまな最良の方法のコレクションを以下に示します http://www.dancancro.com/comparison-of-angularjs-アプリケーションスターター/

于 2014-09-09T04:31:28.020 に答える