首页 > 其他分享 >angular_form

angular_form

时间:2023-01-13 15:35:26浏览次数:32  
标签:function console log form ctrl app angular

<!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() {
          //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>

  

天道酬勤



标签:function,console,log,form,ctrl,app,angular
From: https://blog.51cto.com/u_12304260/6006069

相关文章

  • angular学习-入门基础
    angular所有用到的库,全部用的CDN:运行下面代码<scriptsrc="http://cdn.bootcss.com/jquery/2.1.1/jquery.js"></script><scriptsrc="http://cdn.bootcss.com/an......
  • angular-scope.assign
    <!doctypehtml><html><head><metacharset="utf-8"><title>无标题文档</title></head><scriptsrc="http://localhost:81/js/jquery.js"></script><scriptsrc="http://loc......
  • angular的DEMO(用来练习和顺便看看)
    inflector(辅助) 将用户输入的字符串转化成驼峰或者空格或者底线的小插件;这个是一个小的过滤器,平常也是用不到的,合格是过滤器的代码:app.filter("inflector",......
  • angular的编辑器tinymce
    angular的插件的确挺少的,编辑器更是少,ui-tinymce是angular-ui推荐的一款编辑器​​(GIT:https://github.com/angular-ui/ui-tinymce)​​;效果图通过n......
  • angular实例教程(用来熟悉指令和过滤器的编写)
    angular的插件太少了, 所以很多指令和过滤器都要自己写, 所以对指令传进来的参数,以及angular编译的流程更加熟悉才行写出好的插件,有些简单的指令是参考​​angu......
  • angular的工具方法笔记(equals, HashKey)
    分别是angular脏值检测的工具方法equals和类HashKey的使用方法<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml......
  • angular的canvas画图例子
    angular的例子:<!DOCTYPEhtml><htmlng-app="APP"><head><metacharset="UTF-8"><scriptsrc="http://cdn.bootcss.com/angular.js/1.3.0-beta.12/angular.min.js"></......
  • angular例子笔记
    学习angular的插件写法和制作; <!DOCTYPEhtml><htmlng-app="APP"><head><metacharset="UTF-8"><title>angular-refreshexample</title><scriptsrc="h......
  • angularJS中-$route路由-$http(ajax)的使用
    后台请求使用的是nodeJS驱动(后面帖代码),很简单的RESTFUL,页面使用的是bottstarp3.0(懒人神器); 第一个例子:在本地架设NODEJS,angular的所有请求都是请求本地的300......
  • angular_$inject
    <!DOCTYPEHTML><htmllang="zh-cn"ng-app="MainApp"><head><metacharset="UTF-8"><title>explicit-inject-service</title></head><body><divng-controller="My......