AngularJS 模板到數(shù)據(jù)的綁定

模板到數(shù)據(jù)的綁定，主要是通過(guò) ng-model 來(lái)完成的：

<input type="text" id="test" ng-controller="TestCtrl" ng-model="a" />

<script type="text/javascript">
angular.module('app', [], angular.noop)
.controller('TestCtrl', function($scope){
    $scope.a = '123';
});
angular.bootstrap(document.documentElement, ['app']);
</script>

這時(shí)修改 input 中的值，然后再在控制終端中使用：

$('#test').scope().a

查看，發(fā)現(xiàn)變量 a 的值已經(jīng)更改了。

實(shí)際上， ng-model 是把兩個(gè)方向的綁定都做了。它不光顯示出變量的值，也把顯示上的數(shù)值變化反映給了變量。這個(gè)在實(shí)現(xiàn)上就簡(jiǎn)單多了，只是綁定 change 事件，然后做一些賦值操作即可。不過(guò) ng 里，還要區(qū)分對(duì)待不同的控件。