ホームページ >ウェブフロントエンド >jsチュートリアル >AngularJS を深く学ぶにはどうすればよいですか? angularjs の最新の入門学習体験

AngularJS を深く学ぶにはどうすればよいですか? angularjs の最新の入門学習体験

寻∝梦
寻∝梦オリジナル
2018-09-08 15:50:351521ブラウズ

この記事はすべて angularjs の独学体験に関するものです。しっかり学びたい場合は、他の人の学習結果を読んでください。自分には合わないかもしれませんが、もっと読んでいただければ必ず自分に合ったものを見つけることができます。自分のやり方で、この記事を一緒に見てみましょう。Angularjs1を始めましょう。

AngularJS の 4 つの中心的なアイデア: 依存関係の注入、モジュール化、双方向バインディング、セマンティック タグ。 2、開発ツールとデバッグツール: sublime/webstorm; ブラウザを使用してデバッグします。

3、

最初のAngularJS Webアプリケーション

:

①angular.js ファイル (js/angular.min.js) を導入し、ng-app ディレクティブを使用して AngularJS 管理境界を宣言します。

②AngularJS双方向バインディングの簡単な使用: 二重中括弧 {{}}

③一般的に使用される手順: 公式 API を参照

④<script>で宣言: Angular.module('app', [ ])</script>

){

="角度";
️名前、

{{msg} }

II: 上級 AngularJS


1、

AngularJSフロントエンドの設計と構築MVC: 書き方はシンプルです MVC

2 , コントローラーの使い方: コントローラーで変数を定義し、コントローラーのスコープを表示します。

4. $scopeの変数とメソッド :

①を使用して、$scopeでメソッドを定義し、ページでバインディング呼び出しを行います。

② $scope で変数を定義し、メソッドで使用します。 $scope メソッドの呼び出し方法に注意してください。

3: AngularJS の高度な - サービスと手順の使用

1、Servicesサービスをカスタマイズする:

① angularjsにはサービスの表現形式がたくさんあります。コントローラーでサービスを使用する方法を学びましょう

②AngularJSにおけるサービスの表現は、value、constant(定数)、factory(ファクトリーモードに相当)、services


Services Application : 複数のコントローラーでデータを共有する方法


3.

共通コマンドの使用方法 ng-バインドデータ 2 -way binding ({{ }} と同等); 式が true の場合、HTML 内のフォーム要素を

にバインドします。指定された HTML 要素が表示されます。それ以外の場合、指定された HTML 要素は非表示になります。

ng-hide は式が true の場合に指定された HTML 要素を非表示にし、

ng-if は式が true の場合に削除された要素を追加して表示し、false の場合に要素を (DOM から) 削除します。削除) gNg-SUBMIT 命令は、フォームが送信された後に指定された関数 (input、select、または textarea) を実行するために使用されます。式が true を返す場合、フォーム フィールドは無効になります

; ng-checkde コマンドは、チェックボックスまたはラジオボタンの checkde 属性を設定するために使用されます。true が返される場合、それが選択されます。

ng-src ディレクティブは、AngularJS を深く学ぶにはどうすればよいですか? angularjs の最新の入門学習体験

ng-herf

ディレクティブはネイティブ < ;a> 要素 href 属性;

ng-class を使用して 1 つ以上の CSS クラスを動的にバインドしますHTML 要素;

ng-selected コマンドは、;

ng-change コマンド HTML 要素の値が変更されたときに何を行うかを AngularJS に指示するために使用されます。 は、ng-modelコマンドと一緒に使用する必要があります。

ng-change ディレクティブは、ネイティブの onchange イベントをオーバーライドしません。このイベントがトリガーされた場合、ng-change 式とネイティブの onchange イベントの両方が実行されます。

4、共通命令 ng-repeat の使用法: 命令は、HTML 要素を指定された回数だけループアウトするために使用されます (set は配列またはオブジェクトである必要があります)

特別な属性 ($index 配列の添字、$first (最初の場合は true が返される)、$last) を使用します

4: AngularJS 組み込みサービス - $http の使用

1、 $http を使用して MySql データをクエリする: まず $http リクエストを送信し、バックエンド開発言語を通じてフロントエンドに mysql データを返します。

2. データベースの追加、削除、変更を実装するパラメータを含む$http リクエスト

3. ユーザーロールの権限の例: 実践してください

5: 高度な AngularJS の使用法ディレクティブ

1.

ディレクティブを使用して HTML コンポーネントをカスタマイズします: 意味と用途を制限します (A: 属性、E: 要素、C: クラス名)、置換の使用、テンプレートの使用

2.複数のディレクティブを使用して相互呼び出しを行う

6: AngularJS を使用したモバイル APP 開発

1. Cordova の概要:フロントエンド プラットフォーム、現在の Android および IOS プラットフォーム用のコードをパッケージ化するために使用します

この記事はここで終わります (さらに詳しく知りたい場合) 、PHP 中国語 Web サイトにアクセスします

AngularJS ユーザー マニュアルを学ぶ )、ご質問がある場合は、以下にメッセージを残すことができます。

以上がAngularJS を深く学ぶにはどうすればよいですか? angularjs の最新の入門学習体験の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。