AngualrJS(四)input元素的ng-model属性

来源:互联网 发布:如何入驻淘宝同学 编辑:程序博客网 时间:2024/05/21 17:43

转载出处:http://www.cnblogs.com/liulangmao/p/3713758.html

input元素的ng-model属性:

用于将input的值和变量的值进行双向绑定

复制代码
<!DOCTYPE html><html ng-app><head>  <title>2.3.1input数据绑定</title>  <meta charset="utf-8">  <script src="../angular.js"></script>  <script src="script.js"></script></head><body>  <div ng-controller = 'CheckStatus'>    <form action="">      <input type="checkbox" ng-model="checkRabbit"/>rabbit:<span>{{checkRabbit}}</span>      <br>      <input type="checkbox" ng-model="checkDog"/>dog:<span>{{checkDog}}</span>      <br>      <input type="checkbox" ng-model="checkCat"/>cat:<span>{{checkCat}}</span>    </form>  </div></body></html>
复制代码

如果是text类型的input,绑定的就是它的value,如果是checkbox,绑定的就是选中状态的true或者false,

对input的绑定是双向的,即变量的变化,也会引起选中与否的变化(或者是value的变化),比如这里设置的checkRabbit值是true,那么它就是选中的,其余两个值设置的是false,他们就是不选中的,

同样,改变input的选中状态(或者是value值),它们绑定的变量也会被改变