AngularJs (第三弹)

表单验证篇

条件:

<form name="form1" novalidate>
		<label>you email</label>
		<input name="hh" type="text" ng-model="email" required>
		<span ng-show="form1.hh.$error.required">erro</span>
		<button ng-disabled="form.$invalid">ssss</button>
	</form>

注意:

格式:


####required


####ng-minlength & ng-maxlength


####ng-pattern

	<input type="text" ng-pattern="[a-zA-Z]">

####email


####number


####url


####一些有用的css样式

<form name="form1" novalidate>
		<label>you email</label>
		<input name="hh" type="text" ng-model="email" required>
		<span ng-show="form1.hh.$error.required">erro</span>
		<button ng-disabled="form1.$invalid">ssss</button>
	</form>

####自定义验证


表达式 ####{ exception }

angular 运行$digest 循环过程中会自动解析表达式 $parse 服务用来进行表达式运算 将 $parse 注入到控制器中,调用来进行手动解析表达式


####$parse

	<body ng-app="my">
	<div ng-controller="haha">
	<input type="text" ng-model="name">
	<h3></h3>
	</div>
		<script type="text/javascript">
			angular.module('my', []).controller('haha', function($scope,$parse){
			$scope.$watch('name',function(newVal,oldVal,scope){
				var m = $parse('name | limitTo:3');
				console.log(m(scope));
				$scope.www=m(scope);

				});
			});
		</script>

####$interpolate

如果感觉不能理解,那就简单些说类似于Handlerbars

注意

这里说的是字符串模板,并非html模板

<div ng-controller="haha">
<input type="text" ng-model="name">

</div>
	<script type="text/javascript">
		angular.module('my', []).controller('haha', function($scope,$interpolate){
			var tpl = " know "
			var template = $interpolate(tpl);
			var obj = {
				who:"you",
				password:"12345",
			}
			$scope.mm = template(obj);
		});
	</script>

####$interpolateProvider

angular.module("name",[]).config(function($interpolateProvider){
	$interpolateProvider.startSymbol('--');
	$interpolateProvider.endSymbol('--');
});

模块

优点:

angular.module(‘app’,[])


作用域

生命周期:

指令内部的作用域被称作孤立作用域


控制器