AngularJS とは何ですか? AngularJS_AngularJS の概要

AngularJS とは何ですか?

AngularJS は、動的な WEB アプリケーション用に設計された構造フレームワークです。 HTML をテンプレート言語として使用できるようになり、HTML の構文を拡張することで、アプリケーション コンポーネントをより明確かつ簡潔に構築できます。その革新的な点は、データ バインディングと依存関係の注入を使用して、大量のコードを作成する手間を省くことです。これらはすべてブラウザー側の Javascript を通じて実装されており、サーバー側のテクノロジと完全に統合されます。

AngularJS は、アプリケーションの構築における HTML の欠点を克服するように設計されています。 HTML は、静的なテキスト表示用に設計された優れた宣言型言語ですが、WEB アプリケーションの構築には弱いです。そこで、ブラウザに希望どおりの動作をさせるために、いくつかの作業 (トリックと言ってよいでしょう) を実行しました。形式日付

通常、動的アプリケーションを構築する際の静的 Web ページ テクノロジーの欠点を解決するために、次のテクノロジーを使用します。

1. クラス ライブラリ - クラス ライブラリは、WEB アプリケーションの作成に役立つ関数のコレクションです。制御するのはコードであり、ライブラリをいつ使用するかを決定するのはあなたです。クラス ライブラリには、jQuery などがあります。

2. フレームワーク - フレームワークは、すでに実装されている特別な WEB アプリケーションです。これに特定のビジネス ロジックを入力するだけで済みます。ここでのフレームワークは主導的な役割を果たし、特定のアプリケーション ロジックに従ってコードを呼び出します。フレームワークには、ノックアウト、スプラウトコアなどが含まれます。

AngularJS は別のアプローチを使用し、アプリケーションを構築する際の HTML 自体の欠点を補おうとします。 AngularJS では、ディレクティブと呼ばれる構造を使用してブラウザが新しい構文を認識できるようにします。例:

1. データ バインディングには二重中括弧 {{}} 構文を使用します。 2. DOM 制御構造を使用して DOM フラグメントを反復または非表示にします。 3. サポートフォームとフォーム検証
4. 論理コードを関連する DOM 要素に関連付ける機能
5. HTML を再利用可能なコンポーネントにグループ化する機能。

エンドツーエンドのソリューション

AngularJS は、WEB アプリケーションのエンドツーエンドのソリューションとなることを目指しています。これは、Web アプリケーションの単なる一部ではなく、完全なエンドツーエンドのソリューションであることを意味します。これにより、CRUD (作成の追加、取得のクエリ、更新の更新、削除の削除) アプリケーションを構築するときに、AngularJS が非常に「独自の」ものになります (元のテキストは独自の意見があり、他の方法があまりないことを意味します)。ただし、たとえ「頑固」であっても、その「頑固さ」はアプリケーションを構築するときの開始点にすぎず、変更する柔軟性は依然として確保されています。 AngularJS の優れた機能のいくつかは次のとおりです:

1. CRUD アプリケーションの構築に使用できるものには、データ バインディング、基本テンプレート識別子、フォーム検証、ルーティング、ディープ リンク、コンポーネントの再利用、依存関係の挿入が含まれます。

2. テストには、単体テスト、エンドツーエンドのテスト、シミュレーション、自動テスト フレームワークが含まれます。

3. ディレクトリ レイアウトを使用してアプリケーションをシードし、開始点としてスクリプトをテストします。

AngularJS のかわいさ

AngularJS は、開発者により高いレベルの抽象化を提供することで、アプリケーション開発を簡素化します。他の抽象化手法と同様に、ある程度の柔軟性が失われます。言い換えれば、すべてのアプリケーションが AngularJS に適しているわけではありません。 AngularJS は主に CRUD アプリケーションの構築に関係します。幸いなことに、WEB アプリケーションの少なくとも 90% は CRUD アプリケーションです。ただし、AngularJS での構築に何が適しているかを理解するには、AngularJS での構築に何が適していないのかを理解する必要があります。

たとえば、ゲーム、グラフィカル インターフェイス エディター、頻繁で複雑な DOM 操作を行うアプリケーションは CRUD アプリケーションとは大きく異なり、AngularJS での構築には適していません。このような状況では、jQuery のような軽量でシンプルなテクノロジを使用する方が良いかもしれません。

簡単な AngularJS の例

以下は、フォームを含む典型的な CRUD アプリケーションです。フォーム値は最初に検証され、次にローカル スタイルにフォーマットされた合計値の計算に使用されます。最初に理解する必要がある、開発者間で共通の概念をいくつか示します:

1. データモデル (data-model) をビュー (UI) に関連付けます。 2. ユーザー入力を書き込み、読み取り、検証します

3. モデルに従って新しい値を計算します。

4. 出力形式をローカライズします。

index.html:

コードをコピー コードは次のとおりです:

   
       
       
   
   
       

            請求書:
           

           

           
                数量 コスト
               
                   
                   
               
            テーブル>
           

---

            合計: {{数量 * コスト |通貨}}