官网网址-贡献代码:(仅供参考)
① http://jquery.com/
② http://github.com
③ https://groups.google.com/forum/?hl=en#!forum/angular
④ http://docs.angularjs.org/misc/contribute
angularJs共有4大模块构成MVC,模块和依赖注入、指令,双向数据绑定。虽然分为四大块但是我觉得无论使用那一块的知识都离不开指令,也就是说指令贯穿整个angularJs的应用。
MVC里的控制器ng-controller是指令,获取、同步数据ng-model是指令;模块和依赖注入ng-app也是指令;双向数据绑定更不用说。所以说指令是angularJs的基础。
指令:
(1)ng-app
ng-app这个指令比较特殊,一个html文档最好只出现一次,如果出现多次也是只有第一个起作用,并且可以出现在html文档的任何一个元素上。
ng-app作用是告诉子元素以下的指令是归angularJs的,angularJs会识别的。
ng-app的值可以为空,当然在练习的时候,在项目中则一定是要赋值的。也就是后面所说的模块。angularJs的使用,不是有一句一定要牢记在的话“一切都是由模块开始的”。
(2)ng-model
代码:
<body ng-app="myApp">
<!-- 当输入框的值改变时,form里的值则同步;当点击重置按钮时,则值回到初始化状态也就是设置为user里的值。 -->
<div ng-controller="myForm">
<form>
<label>账号</label>
<input type="text" placeholder="请输入账号" ng-model="user.name"/>
<label>密码</label>
<input type="password" placeholder="密码是由字母、数字、下划线组成" ng-model="user.password"/>
<br/><br/>
<button ng-click="restForm()">重置表单的值</button>
<p>form = {{user}}</p>
<p>user = {{userInfo}}</p>
</form>
</div>
<script type="text/javascript">
var app = angular.module('myApp',[]);
app.controller('myForm',function($scope){
$scope.userInfo = {
name:"张三",
password:"123456"
}
$scope.restForm = function(){
$scope.user = angular.copy($scope.userInfo);
}
$scope.restForm();
});
</script>
</body>
(3)$scope作用域
概念:angularJs里树型结构。在angularJs中,编译html指的是搜索DOM树,找出与指令相关的html。DOM是树型结构,$scope作用域类似DOM的树型结构。因此它有
树型结构有的特征,继承、传播。
生命周期:$scope是有生命周期的,创建、链接、更新、申诉、销毁。
$rootScope是根作用域,作用在ng-app包含的所有html元素中。同样$scope是$rootScope的子作用域。
$scope是angular的一个对象。