angularJS学习笔记

1. angular指令：

ng-app 定义一个 AngularJS 应用程序。(指定哪部分需要用angular管理)

ng-model 把 DOM 元素值绑定到变量。(一般用于标签input, select, textarea)  <input type="text" ng-model="name">

ng-bind 把变量绑定到 DOM元素。(ng-bind="name" 相当于{{name}})  <span ng-bind="name">

ng-init 定义初始值  <div ng-app="myApp" ng-init="name='John'">

ng-repeat 对集合中的每项会克隆一次 HTML 元素 ng-repeat="oneShop in allShops track by $index"

ng-cloak  应用在加载时可能会由于AngularJS 代码未加载完而出现显示 AngularJS 代码，进而会有闪烁的效果， ng-cloak 指令是为了防止该问题的发生

ng-click 关联一个click事件

2. angular过滤器

currency:货币处理 {{num | currency : '￥'}} 默认美元

date:日期格式化  {{date | date : 'yyyy-MM-dd hh:mm:ss EEEE'}}

filter:匹配子串 

{{ childrenArray | filter : 'a' }} //匹配属性值中含有a的

{{ childrenArray | filter : 4 }}  //匹配属性值中含有4的

{{ childrenArray | filter : {name : 'i'} }} //参数是对象，匹配name属性中含有i的

json:转化为json字符串 {{ jsonTest | json}}

limitTo:限制数组或字符串长度（如果是负数则从末尾开始截取） {{ childrenArray | limitTo : 2 }}

lowercase:转化为小写 {{string | lowercase}}

uppercase:转化为大写 {{string | uppercase}}

number:格式化数字（参数可以指定保留小数位数）{{ num | number : 2 }}

orderBy:排序

<div>{{ childrenArray | orderBy : 'age' }}</div>      //按age属性值进行排序，若是-age，则倒序

<div>{{ childrenArray | orderBy : orderFunc }}</div>  //按照函数的返回值进行排序

<div>{{ childrenArray | orderBy : ['age','name'] }}</div>  //如果age相同，按照name进行排序

过滤器用法：

1）模板中使用

{{ expression | filter }}

2）controller和service中使用

app.controller('testC',function($scope,$filter){

    $scope.num = $filter('currency')(123534);

　　$scope.date = $filter('date')(new Date()); 

}

}