过滤器
过滤器是用在表达式中,实现对表达式结果的筛选、过滤、格式化,达到更好的表现效果
语法:|--》管道
{{表达式 | 过滤器1:'name' | 过滤器2 }}
货币及任意符号
<p>{{price}}</p>
<p>{{price | currency}}</p>
<p>{{price | currency :'¥'}}</p>
<p>{{price | currency :'&'}}</p>
时间
<p>{{2336547896454 | date :'yyyy/MM/dd'}}</p> 2044/01/16
<p>{{'lary' | uppercase}}</p> 大写
<p>{{'lary' | lowercase}}</p> 小写
orderBy 升序或者降序 orderBy:'age':true
<ul ng-repeat="obj in list | orderBy:'age':true">
<li>{{obj.name}}</li>
</ul>
js:
$scope.list = [
{name:'Lucy',age:30,score:95},
{name:'Apple',age:10,score:90},
{name:'Pen',age:32,score:100},
{name:'Pen',age:40,score:100}
];
limitTo 限定显示的数量
<ol ng-repeat="obj in list | orderBy:'age':false | limitTo:3">
<li>{{obj.name}}</li>
</ol>
只显示前3个
number 限制显示小数点后几位
<p>{{price | number : 3}}</p>
只显示小数点后面3位
练习:
<ul ng-repeat="obj in list | orderBy:'score':true | limitTo:3"> 按照分数排序,取前三个
<li>{{obj.name+" "+obj.age+" "+obj.score}}</li>
</ul>
</div>
<script>
var app = angular.module('myApp', ['ng']);
app.controller('myCtrl', function ($scope) {
$scope.list = [
{name:'Michael',age:30,score:80},
{name:'Lincoln',age:20,score:90},
{name:'TBag',age:80,score:95},
{name:'TBag1',age:80,score:92},
{name:'TBag2',age:80,score:10}
];
})
toJson/fromJson
序列化:将一个json对象转换为json格式的字符串
反序列化:将一个json格式的字符串 转换为json格式的对象
// 定义一个json对象
var jsonObj = {"name":"Lucy","age":20};
// 通过toJson方法将一个json对象 序列化为一个json格式的字符串
console.log(angular.toJson(jsonObj));
// 通过fromJson方法,将一个json格式的字符串 反序列化为一个json格式的对象
console.log(angular.fromJson(jsonObj))