angularJS提交表单(form)_Javascript教程-查字典教程网
angularJS提交表单(form)
angularJS提交表单(form)
发布时间:2016-12-30 来源:查字典编辑
摘要:代码很简单,就不多废话了,直接奉上代码:复制代码代码如下:无标题文档查看app=angular.module("app",[]);app.d...

代码很简单,就不多废话了,直接奉上代码:

复制代码 代码如下:

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

</head>

<script src="http://localhost:81/js/jquery.js">

</script>

<script src="http://localhost:81/js/angular.min.js">

</script>

<body ng-app="app">

<div ng-controller="TestCtrl">

<div ng-form test>

<input ng-model="a" type="email" />

<button ng-click="do()">查看</button>

</div>

</div>

<script>

app = angular.module("app",[]);

app.directive('test',function() {<br>//form表单的指令都有一个默认的控制器作为第四个参数

var link = function($scope, $element, $attrs, $ctrl) {

$scope.do = function() {

//$ctrl.$setDirty();

console.log($ctrl.$pristine); //form是否没被动过

console.log($ctrl.$dirty); //form是否被动过

console.log($ctrl.$valid); //form是否被检验通过

console.log($ctrl.$invalid); //form是否有错误

console.log($ctrl.$error); //form中有错误的字段

}

}

return {

compile: function() {

return link

},

require: 'form',

restrict: 'A'

}

});

app.controller('TestCtrl', function($scope){

//如果没有contrller,这东西还不会初始化..

});

</script>

</body>

</html>

这里给大家分享的是最基础的angularJS表单验证,希望大家能够喜欢。

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类