AngularJS 模板到数据的绑定

模板到数据的绑定，主要是通过 ng-model 来完成的：

<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>

这时修改 input 中的值，然后再在控制终端中使用：

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

查看，发现变量 a 的值已经更改了。

实际上， ng-model 是把两个方向的绑定都做了。它不光显示出变量的值，也把显示上的数值变化反映给了变量。这个在实现上就简单多了，只是绑定 change 事件，然后做一些赋值操作即可。不过 ng 里，还要区分对待不同的控件。