你的位置:首页 > 软件开发 > Java > AngularJS1.X学习笔记5

AngularJS1.X学习笔记5

发布时间:2017-04-02 00:00:29
大家愚人节快乐!表单是沟通服务器端和客户端的桥梁,为数据从客户端传到服务端打开了一扇大门。AngularJS增加了一些新特性,使我们能够更加方便的操作表单。OK!开始学习!学习使我快乐。一、双向数据绑定  前面已经提到了双向数据绑定,一般而言我们总是从模型中拿到数据放到视图,双向 ...

AngularJS1.X学习笔记5

  大家愚人节快乐!表单是沟通服务器端和客户端的桥梁,为数据从客户端传到服务端打开了一扇大门。AngularJS增加了一些新特性,使我们能够更加方便的操作表单。OK!开始学习!学习使我快乐。

一、双向数据绑定

  前面已经提到了双向数据绑定,一般而言我们总是从模型中拿到数据放到视图,双向数据绑定提供了这样一种机制,可以将视图中的数据放到模型。下面测试一下

<!DOCTYPE html><html lang="en" ng-app='myApp'><head>  <meta charset="UTF-8">  <title>双向数据绑定</title></head><body>  <div ng-controller='dataCtrl'>    <ul>      <li>        <div>复选框是否选中:{{isCheck}}</div>        <div><input type="checkbox" name="check" ng-model="isCheck"></div>      </li>      <li>        <div>文本框的值:{{text}}</div>        <div><input type="text" name="text" ng-model="text"></div>      </li>      <li>        <div>单选按钮选中的值:{{radio}}</div>        <div>        1<input type="radio" name="radio" ng-model="radio" value="1"><br>        2<input type="radio" name="radio" ng-model="radio" value="2">        </div>      </li>    </ul>  </div>    <script type="text/javascript" src='/images/loading.gif' data-original="../node_modules/angular/angular.min.js"></script>  <script type="text/javascript">    var myApp = angular.module("myApp",[]);    myApp.controller('dataCtrl',function($scope){      $scope.isCheck = true;      $scope.text = "我是文本框初始值!";      $scope.radio = "1";    })  </script></body></html>

 

海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com

原标题:AngularJS1.X学习笔记5

关键词:JS

JS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。