AngularJs学习之路(四)
来源:互联网 发布:idown mac怎么用 编辑:程序博客网 时间:2024/05/17 05:15
AngularJS 控制器
AngularJS 应用程序被控制器控制。
ng-controller 指令定义了应用程序控制器。
控制器是 JavaScript 对象,由标准的 JavaScript 对象的构造函数 创建。
控制器方法
上面的实例演示了一个带有 lastName 和 firstName 这两个属性的控制器对象。
控制器也可以有方法(变量和函数):
<div ng-app="myApp" ng-controller="personCtrl">名: <input type="text" ng-model="firstName"><br>姓: <input type="text" ng-model="lastName"><br><br>姓名: {{fullName()}}</div><script>var app = angular.module('myApp', []);app.controller('personCtrl', function($scope) { $scope.firstName = "John"; $scope.lastName = "Doe"; $scope.fullName = function() { return $scope.firstName + " " + $scope.lastName; }});</script>
外部文件中的控制器
在大型的应用程序中,通常是把控制器存储在外部文件中。
angular.module('myApp', []).controller('namesCtrl', function($scope) { $scope.names = [ {name:'Jani',country:'Norway'}, {name:'Hege',country:'Sweden'}, {name:'Kai',country:'Denmark'} ];});在应用中使用控制器文件:
<div ng-app="myApp" ng-controller="namesCtrl"><ul> <li ng-repeat="x in names"> {{ x.name + ', ' + x.country }} </li></ul></div><script src="namesController.js"></script>
阅读全文
0 0
- AngularJs学习之路(四)
- angularJS学习之路(四)---作用域(1)
- Angular学习(四)之AngularJS 控制器
- AngularJS学习之四(分支之二):架构概述
- AngularJS学习笔记(四)
- AngularJS学习笔记(四)
- angularjs学习之四(解决模板视图和angularjs之间的冲突 )
- angularjs学习之七(angularjs中指令的四种基本形式)
- AngularJS学习之路(一)AngularJS简单操作
- AngularJS学习之路(二)AngularJS的表达式
- angularJS学习之路(二)---模块
- angularJS学习之路(三)---控制器
- angularJS学习之路(五)---表达式
- angularJS学习之路(六)---指令
- AngularJs学习之路(一)
- AngularJs学习之路(二)
- AngularJs学习之路(三)
- AngularJs学习之路(五)
- word-break-ii
- Java中for循环的应用
- 循环比赛日程表 (分治)
- bzoj 2818 Gcd(莫比乌斯反演)
- 金笛检测工具检测到at标识是ok,未读卡,无信号
- AngularJs学习之路(四)
- poj2559 Largest Rectangle in a Histogram
- KMP总结
- HTML-ajax与数据库
- 169. Majority Element
- Invalid character found in method name. HTTP method names must be tokens
- tensorflow (win10 & cuda &anaconda )安装
- Visio 画流程图 入门
- 编写Qt多窗口程序