AngularJS 控制器
AngularJS 控制器 控制 AngularJS 应用程序的数据。
AngularJS 控制器是常规的 JavaScript 对象。
AngularJS 控制器
AngularJS 应用程序被控制器控制。
ng-controller 指令定义了应用程序控制器。
控制器是 JavaScript 对象,由标准的 JavaScript 对象的构造函数 创建。
AngularJS 实例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="/UploadFiles/2021-04-02/angular.min.js">运行结果:
名:
姓:
姓名: John DoeAngularJS 应用程序由 ng-app 定义。应用程序在 <div> 内运行。
ng-controller="myCtrl" 属性是一个 AngularJS 指令。用于定义一个控制器。
myCtrl 函数是一个 JavaScript 函数。
AngularJS 使用$scope 对象来调用控制器。
在 AngularJS 中, $scope 是一个应用象(属于应用变量和函数)。
控制器的 $scope (相当于作用域、控制范围)用来保存AngularJS Model(模型)的对象。
控制器在作用域中创建了两个属性 (firstName 和 lastName)。
ng-model 指令绑定输入域到控制器的属性(firstName 和 lastName)。
控制器方法
上面的实例演示了一个带有 lastName 和 firstName 这两个属性的控制器对象。
控制器也可以有方法(变量和函数):
AngularJS 实例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="/UploadFiles/2021-04-02/angular.min.js">运行效果:
名:
姓:
姓名: John Doe外部文件中的控制器
在大型的应用程序中,通常是把控制器存储在外部文件中。
只需要把 <script> 标签中的代码复制到名为 personController.js 的外部文件中即可:
AngularJS 实例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="/UploadFiles/2021-04-02/angular.min.js">运行结果:
名:
姓:
姓名: John Doe其他实例
以下实例创建一个新的控制器文件:
angular.module('myApp', []).controller('namesCtrl', function($scope) { $scope.names = [ {name:'Jani',country:'Norway'}, {name:'Hege',country:'Sweden'}, {name:'Kai',country:'Denmark'} ]; });保存文件为 namesController.js:
然后,在应用中使用控制器文件:
AngularJS 实例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="/UploadFiles/2021-04-02/angular.min.js">运行效果:
- Jani, Norway
- Hege, Sweden
- Kai, Denmark
以上就是对AngularJS 控制器资料的整理,后续继续补充。
更新动态
- 永恒英文金曲精选4《TheBestOfEverlastingFavouritesVol.4》[WAV+CUE]
- 群星《国风超有戏 第9期》[320K/MP3][13.63MB]
- 群星《国风超有戏 第9期》[FLAC/分轨][72.56MB]
- P1X3L《P1X3L》[320K/MP3][143MB]
- 群星.2022-良辰好景知几何电视剧原声带【SONY】【FLAC分轨】
- 庾澄庆.1991-管不住自己【福茂】【WAV+CUE】
- 欧倩怡.2001-Cindy(EP)【华星】【WAV+CUE】
- P1X3L《P1X3L》[FLAC/分轨][791.28MB]
- 茵达INDAHKUS《茵 the Blue》[320K/MP3][33.49MB]
- 茵达INDAHKUS《茵 the Blue》[FLAC/分轨][147.57MB]
- 老虎鱼AnneClarkwithUllavanDaelenJustinCiuche-Borderland-HiRes-Files24bit88.2kHz
- 江玲2004-百合盛开2CD[歌林][WAV+CUE]
- 孙露《怕什么孤单3CD》深圳音像[WAV分轨]
- s14全球总决赛目前是什么结果 s14全球总决赛赛程结果图一览
- s2TPA夺冠五人名单都有谁 tpa战队s2夺冠队员名单一览