功用
数据绑定
AngularJS的双向数据绑定，一方面能够做到model变化驱动了DOM中元素变化，另一方面也能够做到DOM元素的变化也会影响到Model。
在我们运用jQuery的时刻，代码中会大批充溢相似如许的语句：
/
取得TEXT.AREATEXT的值/var textval = $(“#text_id”).attr(“value”);
//或许
var textval = $(“#text_id”).val();
/
猎取单选按钮的值/var valradio = $(“input@type=radio”).val();
/
猎取一组名为(items)的radio被选中项的值/var item = $(‘input@name=items’).val();
/
猎取复选框的值/var checkboxval = $(“#checkbox_id”).attr(“value”)；
/
猎取下拉列表的值/var selectval = $(‘#select_id’).val();
//文本框，文本地区：
$(“#text_id”).attr(“value”,”);//清空内容
$(“#text_id”).attr(“value”,’test’);//添补内容
//多选框checkbox：
$(“#chk_id”).attr(“checked”,”);//使其未勾选
$(“#chk_id”).attr(“checked”,true);//勾选
if($(“#chk_id”).attr(‘checked’)==true) //推断是不是已选中
//单选组radio：
$(“input[@type=radio]”).attr(“checked”,’2′);//设置value=2的项目为当前选中项
//下拉框select：
$(“#select_id”).attr(“value”,’test’);//设置value=test的项目为当前选中项
$(“<option value=’test’>test</option><option value=’test2′>test2</option>”).appendTo(“#select_id”)//增加下拉框的option
$(“#select_id”).empty()；//清空下拉框
猎取一组名为(items)的radio被选中项的值
var item = $(‘input@name=items’).val();//若未被选中 则val() = undefined
猎取select被选中项的文本
var item = $(“select[@name=items] option[@selected]”).text();
select下拉框的第二个元素为当前选中值
$(‘#select_id’)[0].selectedIndex = 1;
radio单选组的第二个元素为当前选中值
$(‘input[@name=items]’).get(1).checked = true;
即频仍的DOM操纵（读取和写入），实在我们的终究目标并非要操纵DOM，而是要完成营业逻辑。angular的数据绑定将让你挣脱DOM操纵，只需模板与数据经由过程声明举行了绑定，二者将随时坚持同步，最新的数据会及时显现在页面中，页面中用户修正的数据也会及时被纪录在数据模型中。
实例
从View到Controller再到View的数据交互：
<html ng-app="demoApp">
……
<input type="text" ng-model="user.name" placeholder="请输入称号"/>
Hello, {{ user.name }}！
……
症结： ng-app 、 ng-model 和 { {user.name } }
起首： <html>元素的ng-app属性。标识这个DOM内里的内容将启用AngularJS运用。
其次：通知AngularJS，对页面上的“user.name” 这个Model举行双向数据绑定。
第三：通知AngularJS，在“{{ user.name}}”这个指令模版上显现“user.name”这个Model的数据。
从Server到Controller再到View的数据交互：
<html ng-app="demoApp">
……
<div ng-controller="demoController">
<input type="text" ng-model="user.name" disabled="disabled"/>
<a href="javascript:void(0);" target="_blank" rel="nofollow">猎取名字 </a>
……
demoApp.controller("demoController", function($http, $scope){
$scope. getAjaxUser = function(){
$http.get({url:"../xxx.action"}).success(function(data){
$scope.user= data;
});
$scope.user = {"name":"从JOSN中猎取的称号","age":22};
};
});
转变$scope中的user，View也会自动更新。
作用域
scope
1>$scope
$scope是一个把view（一个DOM元素）贯穿连接到controller上的对象。在我们的MVC构造里，这个 $scope 将成为model，它供应一个绑定到DOM元素（以及其子元素）上的excecution context。
浅显一点$scope 实际上就是一个JavaScript对象，controller和view都能够接见它，所以我们能够应用它在二者间通报信息。在这个 $scope 对象里，我们既存储数据，又存储将要运行在view上的函数。
$scope是一个将view（一个DOM元素）贯穿连接到controller上的对象。每个Angular运用都邑有一个 $rootScope。这个 $rootScope 是最顶级的scope，它对应着含有 ng-app 指令属性的谁人DOM元素。
$scope也是一个JavaScript对象，指向运用程序作用域内的一切HTML元素和实行上下文。
一切$scope都遵照原型继续，这意味着它们都能接见父$scope，也具有原型链那样的特征，即向上接见属性和要领，直到最顶层。
在ng-repeat、ng-switch、ng-view、ng-include都邑建立一个新的子scope，所以题目常常在这些指令中涌现。
在你的model中，带有「.」将会确认原型继续在起作用。所以运用
<input type="text" ng-model="someObj.prop1">
比
<input type="text" ng-model="prop1">
更好。
假如你真的想要（或须要）运用一个原始的体式格局，有两项事情：
在子scope中，运用$parent.parentScopeProperty。这将阻挠子scope建立它自己的属性。
在父scope上建立一个要领，而且从子scope中调用它，通报原始值到父scope中（并不老是起作用）。
