AngularJS
day1�
- <html ng-app>:
使用angular来引导整个html页面 - ng-model="yourname":
双向绑定一个变量
day2
scope
-
ng-controller=''
表示了控制器 -
scope的apply机制:
将数据模型的变化在整个应用范围内进行通知 -
$rootScope与np-app元素绑定,$rootScope是所有$scope的对象的父类
-
scope的使用:
angular.module("myApp",[]) .controller('Mycontroller',($scope)=>{ scope.name = "Ari" }) -
scope的生命周期:
- 创建
- 链接:
$watch函数 - 更新:
监控函数出现变化的时候,会触发指定的回调函数 - 销毁:
调用$scope上的destroy()方法
controller
-
在module中创建controller
var app = angular.module("app",[]); app.controller('FirstController',($scope)=>{ $scope.message = "hello"; }); -
ng-click:
触发的是浏览器的mouseup指令
expression
- $parse手动解析表达式
- 插值字符串
$interpolate- text(字符串,必需的):
一个包含字符插值标记的字符串 - mustHaveExpression(bool):
如果为true,当传入的字符串中不含有表达式时会返回null - trustedContext(string):29.4节
- text(字符串,必需的):
-
$watch监听一个属性的改变来进行操作 -
$interpolate监听的是{{}},如果要监听别的起始字符和结束字符,使用$interpolateProvider,并使用startSymbol(value)和endSymblo(value)
filter
-
过滤器的调用方式:
{{expr | filter}} -
常见的过滤器
-
currency:转化货币格式 -
date:转化日期格式 -
filter:自定义格式进行过滤 -
json:可以将JSON或JS对象转化成字符串 -
limitTi:按次序进行过滤 -
lowercase:转换为小写 -
number:1:将数字转换成字符串 -
orderBy:进行排序 -
uppercase:转换为大写字符
-
-
自定义过滤器
angular.module('myApp.filters',[]) .filter('name',()=>{function}){} -
表单验证
- 必填项:
required - 最小长度:
ng-minlength="5" - 最大长度:
ng-maxlength="20" - 模式匹配:
ng-pattern="[]"指定正则表达式 - 电子邮件:
<input type="email" name="email" ng-model="user.email">类型 - 数字:
<input type="number" > - URL:
<input type="url"> - 自定义验证:chap10
- 在表单中控制变量:
formName.inputFieldName.property-
formName.inputFieldName.$pristine:未修改表单返回true -
formName.inputFieldName.$dirty:修改过返回true -
formName.inputFieldName.$valid:合法返回true -
formName.i�nputFieldName.$invalid:不合法返回true -
formName.inputFieldName.$error:验证失败返回true
-
- 必填项:
网友评论