ホームページ > 記事 > ウェブフロントエンド > angularJs を使用して Web プロジェクトを構築するにはどうすればよいですか? angularjs を使用した Web プロジェクトの構築の詳細な紹介
angularJs を使用して Web プロジェクトを構築するにはどうすればよいですか? angularjs を使用した Web プロジェクトの構築の詳細な紹介
- 寻∝梦オリジナル
- 2018-09-08 14:38:111996ブラウズ
この記事では主に angularjs を使用して Web プロジェクトを構築する手順を段階的に紹介します angularjs を使用して Web プロジェクトを構築したい場合は、まずこの記事を読んでください
。
1. はじめに
angularjs は人気のあるフロントエンド フレームワークとして現在リリースされており、1.2.X 以降を学習した結果の一部です。 LZ もバージョン 2.0 を学習しており、学校から戻ったらみんなとコミュニケーションをとって学習する予定です。
2. AngularJsの簡単な紹介
AngularJS は主に単一ページの Web アプリケーションを構築するために使用されます。開発者と一般的な Web アプリケーション開発タスクの間の抽象化レベルを高めることで、インタラクティブな最新の Web アプリケーションの構築が容易になります。 詳細については、AngularJs の権威あるチュートリアルをご覧ください
以下の内容は、AngularJs をある程度理解している学生向けであり、理解していない学生は、まず権威あるチュートリアルを読んでください。
3. コード設計
まずプロジェクト ファイル ディレクトリを見てみましょう。ポータルファイルにアクセスするもちろん、これは私たちが書かなければならない最初の文書です。
<!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="css/bootstrap.css"> </head> <body> <p> <p> <p ng-include="'views/common/menu.html'"></p> <p ui-view></p> </p> </p> <script src="libs/angular.js"></script> <script src="libs/angular-ui-router.js"></script> <script src="app.js"></script> <script src="module/first/firstController.js"></script> <script src="module/second/secondController.js"></script> </body> </html>
コードの説明:
ng-app は angularjs のスコープを表します。通常は html タグのヘッダーに記述します。 HTML 全体が angularjs ロールの影響を受けます。一般に、1 つの HTML に対して ng-app を 1 つだけ記述するだけで十分です。 (さらに詳しく知りたい場合は、PHP 中国語 Web サイト
にアクセスして学習してください) ui-view はルーティングを表します。これは、URL 上のパスに対応するページがこの p の下に表示されることを意味します。 pに内容は書き込めません 書いても無効となります。 [ ] 参照するモジュールを挿入します。たとえば、最初のモジュールは ui-view というモジュール名です。次に、Config メソッドを呼び出してルーティングの定義を開始します。$ StateProvider、$ UrlrouterProvider を引用し、次に stateProvider の state メソッドを呼び出して各ルーティングを定義します。これは、アドレスが RST に表示されるときを意味します。ルート内に URL が定義されていない場合は、最初のルートに対応するページにジャンプします。
この記事はここで終わります (さらに詳しく知りたい場合は、PHP 中国語 Web サイト
AngularJS ユーザー マニュアルにアクセスして学習してください)。ご質問がある場合は、以下にメッセージを残してください。
以上がangularJs を使用して Web プロジェクトを構築するにはどうすればよいですか? angularjs を使用した Web プロジェクトの構築の詳細な紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。