AngularJS表单基本操作


Posted in Javascript onJanuary 09, 2017

本文实例为大家分享了AngularJS表单简单操作代码,供大家参考,具体内容如下

HTML正文:

<div ng-app="myApp" ng-controller="myCtrl">
 <!-- novalidate:当提交表单时不对表单数据(输入)进行验证 -->
 <form novalidate>
  First Name:<input type="text" ng-model="user.firstName"><br>
  Last Name:<input type="text" ng-model="user.lastName">
  <br><br>
  <button ng-click="reset()">RESET</button>
 </form>
 <p>form = {{user }}</p>
 <p><font color="red">initInfo = {{initInfo}}</font></p>
</div>

Javascript操作代码:

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.initInfo = {firstName:"squirrel", lastName:"Python"};
  $scope.reset = function() {
    $scope.user = angular.copy($scope.initInfo); // user对象等于master对象:深复制
  };
  //JS扫描脚本时会自动调用reset方法进行输入框信息的初始化
  $scope.reset();
});

效果:

AngularJS表单基本操作

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于jQuery的试卷自动排版系统实现代码
Jan 06 Javascript
Javascript和HTML5利用canvas构建Web五子棋游戏实现算法
Jul 17 Javascript
js中onload与onunload的使用示例
Aug 25 Javascript
12306 刷票脚本及稳固刷票脚本(防挂)
Jan 04 Javascript
js replace()去除代码中空格的实例
Feb 14 Javascript
js实现悬浮窗效果(支持拖动)
Mar 09 Javascript
浅谈react 同构之样式直出
Nov 07 Javascript
支付宝小程序自定义弹窗dialog插件的实现代码
Nov 30 Javascript
使用异步组件优化Vue应用程序的性能
Apr 28 Javascript
详解Element-UI中上传的文件前端处理
Aug 07 Javascript
vue监听浏览器原生返回按钮,进行路由转跳操作
Sep 09 Javascript
vue中watch的用法汇总
Dec 28 Vue.js
AngularJS Controller作用域
Jan 09 #Javascript
详解JavaScript树结构
Jan 09 #Javascript
angular分页指令操作
Jan 09 #Javascript
jquery.zclip轻量级复制失效问题
Jan 08 #Javascript
JavaScript &amp; jQuery完美判断图片是否加载完毕
Jan 08 #Javascript
纯javaScript、jQuery实现个性化图片轮播【推荐】
Jan 08 #Javascript
js实现选项卡内容切换以及折叠和展开效果【推荐】
Jan 08 #Javascript
You might like
PhpMyAdmin中无法导入sql文件的解决办法
2010/01/08 PHP
PHP 数组基础知识小结
2010/08/20 PHP
php在线解压ZIP文件的方法
2014/12/30 PHP
PHP递归算法的简单实例
2019/02/28 PHP
js一组验证函数
2008/12/20 Javascript
js汉字转拼音实现代码
2013/02/06 Javascript
json字符串之间的相互转换示例代码
2014/08/21 Javascript
readonly和disabled属性的区别
2015/07/26 Javascript
JavaScript实现斗地主游戏的思路
2016/02/29 Javascript
nodeJs爬虫获取数据简单实现代码
2016/03/29 NodeJs
一分钟理解js闭包
2016/05/04 Javascript
angular双向绑定模拟探索
2016/12/26 Javascript
element-ui 上传图片后清空图片显示的实例
2018/09/04 Javascript
vue在index.html中引入静态文件不生效问题及解决方法
2019/04/29 Javascript
layui写后台表格思路和赋值用法详解
2019/11/14 Javascript
微信小程序wxml列表渲染原理解析
2019/11/27 Javascript
JavaScript实现简单计算器
2020/03/19 Javascript
vue.js 输入框输入值自动过滤特殊字符替换中问标点操作
2020/08/31 Javascript
js获取url页面id,也就是最后的数字文件名
2020/09/25 Javascript
js实现扫雷源代码
2020/11/27 Javascript
[48:44]2014 DOTA2国际邀请赛中国区预选赛5.21 TongFu VS HGT
2014/05/22 DOTA
[01:54]胎教DOTA2 准妈妈玩家现身中国区预选赛
2016/06/26 DOTA
使用Python 统计高频字数的方法
2019/01/31 Python
python实现植物大战僵尸游戏实例代码
2019/06/10 Python
布隆过滤器的概述及Python实现方法
2019/12/08 Python
PyQt5 如何让界面和逻辑分离的方法
2020/03/24 Python
python raise的基本使用
2020/09/10 Python
基于pycharm 项目和项目文件命名规则的介绍
2021/01/15 Python
从当地商店送来的杂货:Instacart
2018/08/19 全球购物
马来西亚最大的在线隐形眼镜商店:MrLens
2019/03/27 全球购物
实习销售业务员自我鉴定
2013/09/21 职场文书
实用的简历自我评价
2014/03/06 职场文书
《微笑着面对生活》优秀演讲稿范文
2014/09/23 职场文书
拾金不昧通报表扬范文
2015/05/05 职场文书
GO语言字符串处理函数之处理Strings包
2022/04/14 Golang
Vue3实现简易音乐播放器组件
2022/08/14 Vue.js