AngularJS 控制器控制AngularJS 應(yīng)用程序的數(shù)據(jù)。AngularJS 控制器是常規(guī)的JavaScript 對象。AngularJS 控制器AngularJS 應(yīng)用程序被控制器控制。ng-controller指令定義了應(yīng)用程序控制器?？刂破魇荍avaScript 對象由標(biāo)準(zhǔn)的 JavaScript對象的構(gòu)造函數(shù)創(chuàng)建。AngularJS 實(shí)例div ng-appmyApp ng-controllermyCtrl名: input typetext ng-modelfirstNamebr姓: input typetext ng-modellastNamebrbr姓名: {{firstName lastName}}/divscriptvar app angular.module(myApp, []);app.controller(myCtrl, function($scope) {$scope.firstName John;$scope.lastName Doe;});/script嘗試一下 ?應(yīng)用解析AngularJS 應(yīng)用程序由ng-app定義。應(yīng)用程序在 div 內(nèi)運(yùn)行。ng-controllermyCtrl屬性是一個(gè) AngularJS 指令。用于定義一個(gè)控制器。myCtrl函數(shù)是一個(gè) JavaScript 函數(shù)。AngularJS 使用$scope對象來調(diào)用控制器。在 AngularJS 中 $scope 是一個(gè)應(yīng)用對象(屬于應(yīng)用變量和函數(shù))。控制器的$scope相當(dāng)于作用域、控制范圍用來保存AngularJS Model(模型)的對象?？刂破髟谧饔糜蛑袆?chuàng)建了兩個(gè)屬性 (firstName和lastName)。ng-model指令綁定輸入域到控制器的屬性firstName 和 lastName?？刂破鞣椒ㄉ厦娴膶?shí)例演示了一個(gè)帶有 lastName 和 firstName 這兩個(gè)屬性的控制器對象?？刂破饕部梢杂蟹椒ㄗ兞亢秃瘮?shù)AngularJS 實(shí)例div ng-appmyApp ng-controllerpersonCtrl名: input typetext ng-modelfirstNamebr姓: input typetext ng-modellastNamebrbr姓名: {{fullName()}}/divscriptvar app angular.module(myApp, []);app.controller(personCtrl, function($scope) {$scope.firstName John;$scope.lastName Doe;$scope.fullName function() {return $scope.firstName $scope.lastName;}});/script嘗試一下 ?外部文件中的控制器在大型的應(yīng)用程序中通常是把控制器存儲(chǔ)在外部文件中。只需要把 script 標(biāo)簽中的代碼復(fù)制到名為 personController.js 的外部文件中即可AngularJS 實(shí)例div ng-appmyApp ng-controllerpersonCtrlFirst Name: input typetext ng-modelfirstNamebrLast Name: input typetext ng-modellastNamebrbrFull Name: {{firstName lastName}}/divscript srcpersonController.js/script其他實(shí)例以下實(shí)例創(chuàng)建一個(gè)新的控制器文件:angular.module(myApp, []).controller(namesCtrl, function($scope) { $scope.names [ {name:Jani,country:Norway}, {name:Hege,country:Sweden}, {name:Kai,country:Denmark} ]; });保存文件為 namesController.js:然后在應(yīng)用中使用控制器文件:AngularJS 實(shí)例div ng-appmyApp ng-controllernamesCtrlulli ng-repeatx in names{{ x.name , x.country }}/li/ul/divscript srcnamesController.js/script