zoukankan      html  css  js  c++  java
  • angular学习笔记(四)- input元素的ng-model属性

    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值),它们绑定的变量也会被改变

  • 相关阅读:
    06springmvc文件上传
    07springmvc文件下载
    05springmvc-json-ajax使用
    04springmvc请路径参数
    03springmvc项目使用静态资源
    02springmvc注解入门
    springmvc入门
    20mybatis集成jndi
    19mybatis集成dbcp
    怎样用hibernate验证登陆界面的用户名和密码
  • 原文地址:https://www.cnblogs.com/liulangmao/p/3713758.html
Copyright © 2011-2022 走看看