AngularJS 支持双向数据绑定,比如使用表达式{{xxx}}的方式。也可以通过ng-bind属性体现从js到html的变化,同时也支持watch的方式,把html的变化反应到js中去。。。
<!DOCTYPE html> <html> <body> <div ng-app="myapp"> <p>在输入框中尝试输入:</p> <p>姓名:<input type="text" ng-model="name"></p> <p ng-bind="name"></p> </div> <script src="http://apps.bdimg.com/libs/angular.js/1.3.9/angular.min.js"></script> </body> </html>
在上面的例子中,首先有个ng-app,ng-app主要用来定义一个应用。我们的所有需要angular管理的元素均放到带有这个属性的标签里面。。
其次,ng-model 标签用来将input框的值绑定到变量name上面。。
再其次,下面带有ng-bind属性的p标签,用于显示变量name的值。。当然也可以通过{{name}}的形式表现出来,不过不推荐这样的做法,因为有时候会产生延迟的问题,在刷新或加载的过程中,会显示出令人不爽的{{name}}代码出来。。。如果通过属性的方式就不会存在这样的问题