1.HTML控件:以下HTML input元素被称为HTML控件:

**input元素

**select元素

**button元素

**textarea元素

2.AngularJS表单实例:

<div ng-app="myApp" ng-controller="formCtrl">

  <form novalidate>      //novalidate属性是在HTML5中新增的,禁用了使用浏览器的默认验证

First Name:<br>

  <input type="text" ng-model="user.firstName"></br>          //ng-model指令绑定了两个input元素到模型的user对象

  Last Name:<br>

  <input type="text" ng-model="user.lastName">

  <br><br>

  <button ng-click="reset()">RESET</button>

  </form>

  <p>form={{user}}</p>

  <P>master={{master}}</P>

</div>

<script>

var app=angular.module('myApp',[]);

app.controller('formCtrl',function($scope){                //formCtrl函数设置了master对象的初始值,并定义了reset()方法

  $scope.master={firstName:"John",lastName:"Doe"}

  $scope.reset=function(){                                     //reset()方法设置了user对象等于master对象

    $scope.user=angular.copy($scope.master)

  };

  $scope.reset();

});

</script>

AngularJS学习之表单的更多相关文章

  1. AngularJs学习笔记-表单处理

    表单处理 (1)Angular表单API 1.模板式表单,需引入FormsModule 2.响应式表单,需引入ReactiveFormsModule   (2)模板式表单 在Angular中使用for ...

  2. AngularJS中的表单验证

    AngularJS中的表单验证 AngularJS自带了很多验证,什么必填,最大长度,最小长度...,这里记录几个有用的正则式验证 1.使用angularjs的表单验证 正则式验证 只需要配置一个正则 ...

  3. bootstrap基础学习【表单含按钮】(二)

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. AngularJs入门之表单开发

    本文和大家分享的主要是前端开发中必备的AngularJs框架表单开发相关基础知识,希望对大家使用和学习AngularJs有所帮助. 1.简单的表单提交: 2.更多的表单元素: 3.初始化表单: 代码 ...

  5. 使用angularjs实现注册表单

    本文是在学习angularjs过程中做的相应的练习 github地址 https://github.com/2016Messi/angularjs1.6-form 演示地址 https://2016m ...

  6. 【AngularJS】—— 5 表单

    这部分,我们写一个表单程序,使用angularjs的检测并完成表单属性的获取与拷贝. 在AngularJS中,也支持html5中多种控件的自动检测,如:text.number.url.email.ra ...

  7. [jQuery学习系列五 ]5-Jquery学习五-表单验证

    前言最近总是有一个感觉,虽然这些东西都自己学习并一个案例一个案例的去验证过了.但是总觉得不写成博客记录下来这些都不是自己的东西(心理作用,哈哈).所以每当学习或者复习相关的知识我都喜欢记录下来,下面开 ...

  8. AngularJS系列:表单全解(表单验证,radio必选,三级联动,check绑定,form提交验证)

    一.查看$scope -->寻找Form控制变量的位置 Form控制变量 格式:form的name属性.input的name属性.$... formName.inputField.$pristi ...

  9. 学习W3SCHOOL 表单验证

    //表单学习笔记 //建立一张表单的验证 <!DOCTYPE html> <html> <head> <meta http-equiv="Conte ...

随机推荐

  1. Divide and conquer:Telephone Lines(POJ 3662)

    电话线 题目大意:一堆电话线要你接,现在有N个接口,总线已经在1端,要你想办法接到N端去,电话公司发好心免费送你几段不用拉网线,剩下的费用等于剩余最长电话线的长度,要你求出最小的费用. 这一看又是一个 ...

  2. 如何让VS2013编写的程序

    总体分c++程序和c#程序 1.c++程序 这个用C++编写的程序可以经过设置后在XP下运行,主要的“平台工具集”里修改就可以. 额外说明:(1)程序必须为Dotnet 4.0及以下版本.(XP只支持 ...

  3. 手风琴特效 transition

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  4. ExpandableListView的用法

    ExpandableListView组件是android中一个比较常用的组件,当点击一个父item的时候可以将它的子item显示出来,像手机QQ中的好友列表就是实现的类型效果.使用Expandable ...

  5. .NET微信公众号开发-4.0公众号消息处理

    一.前言 微信公众平台的消息处理还是比较完善的,有最基本的文本消息,到图文消息,到图片消息,语音消息,视频消息,音乐消息其基本原理都是一样的,只不过所post的xml数据有所差别,在处理消息之前,我们 ...

  6. eclipse快捷键Alt + / 失效

    最近电脑上的Eclipse没有了自动提示功能,也不是全部不提示,大多数情况下按下"alt+/"键还会产生提示,但是当我在java项目中邪main方法和syso的时候,"a ...

  7. iOS 语录

    1. 输入法切换: cmd + space 2. xcode 退出全屏control + cmd + f 3. xcode 代码格式化插件Uncrustify,XAlign, CLangFormat ...

  8. case/casez/casex 的区分与使用

    参考:http://www.cnblogs.com/poiu-elab/archive/2012/11/02/2751323.html 与  verilog数字系统设计基础 一般来说,使用最多的是CA ...

  9. windows  远程桌面命令 mstsc

    win+R------>mstsc: 弹出: 目标机必开远程

  10. EasyUi–8.datebox赋值的问题

    这个问题要从EasyUI的datebox组件说起,小菜用这个组件的时候,发现用$("#id").val()这种形式,居然拿不到文本框的值!      经过度娘的帮助,发现可以用$( ...