AngularJSアプリケーションは、主にコントローラーに依存して、アプリケーション内のデータの流れを制御します。コントローラーは、NGコントローラー命令を使用して定義されます。コントローラーは、プロパティ/プロパティとJavaScriptオブジェクトを含む関数です。各コントローラーは、コントローラーによって制御されるアプリケーション/モジュールを指定する$スコープパラメーターを受け入れます。
<div ng-app = "" ng-controller = "StudentController"> ... </div>
ここでは、NG-Controllerディレクティブを使用するコントローラーStudentControllerを宣言しました。次のステップとして、次のようにStudentControllerを定義します
<script> function StudentController（$ scope）{$ scope.student = {firstName： "yiibai"、lastName： "com"、fullName：function（）{var desutionObject; StudentObject = $ scope.student; retund studentObject.firstname + "" + desudentObject.lastName; }};} </script>StudentControllerは、$ ScopeをJavaScriptオブジェクトパラメーターとして定義します。
$スコープは、StudentControllerオブジェクトを使用してアプリケーションを表します。
$ SCOPE.STUDENTは、StudentControllerオブジェクトのプロパティです。
FirstNameとLastNameは、$ scope.studentオブジェクトの2つのプロパティです。デフォルト値をそれらに渡しました。
FullNameは$ scope.studentオブジェクトの関数であり、そのタスクはマージされた名前を返すことです。
FullName関数では、学生オブジェクトに組み合わせの名前を返すようになりました。
図として、コントローラーオブジェクトを別のJSファイルに定義して、HTMLページをファイルに配置することもできます。
これで、NG-Modelを使用するか、次のように式を使用して、StudentControllerのプロパティを使用できます。
名の入力：<入力タイプ= "text" ng-model = "sudent.firstname"> <br>姓を入力：<入力タイプ= "text" ng-model = "desudent.lastname"> <br> <br>入力しています：{{desudent.fullname（）}}}}これで、2つの入力ボックスがあります。Student.FirstNameとStudent.lastNameです。
これで、htmlに追加されたStudent.fullname（）メソッドがあります。
次に、最初の名前とLastName入力ボックスを入力して入力するものを入力するだけで、2つの名前が自動的に更新されることがわかります。
例
次の例では、コントローラーの使用を示します。
testangularjs.htmlファイルのコンテンツは次のとおりです。
<html> <head> <title> Angular JS Controller </title> </head> <body> <body> <h2> angularjsサンプルアプリケーション</h2> <div-app = "" ng-controller = "sudintcontroller">名の入力：<入力タイプ= "テキスト" ng-model = "desudent.firtname"> <br> <br> <br> <br> <br> <br> <br> <br> <br> ng-model = "sustent.lastname"> <br> <br>入力：{{sustent.fullname（）} </div> <script> function StudentController（$ scope）{$ scope.student = {firstName： "mahesh"、lastName： "parashar"、fullname：vers（） StudentObject = $ scope.student; retund studentObject.firstname + "" + desudentObject.lastName; }};} </script> <script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"> </script> </body> </html>出力
WebブラウザでTextangularjs.htmlを開き、次の結果を確認してください。
上記は、AngularJSコントローラーを整理する情報です。将来、関連する知識を整理し続けます。このウェブサイトへのご支援ありがとうございます。