您的位置：首页 > Web前端 > AngularJS

angularJS过滤器和自定义的过滤器

2016-03-17 18:45 531 查看

<!DOCTYPE html>
<html lang="en">
<header>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="angular.min.js"></script>
<title>Title</title>
</header>
<body>
<div ng-app="demo">
<div ng-controller="firstController">
<li >大写的过滤：{{firstName|uppercase}}</li>
<li >小写的过滤：{{firstName|lowercase}}</li>

<br>时间格式的过滤:<br>
<li>年月日：{{ today | date:'yyyy-MM-dd' }}</li>
<li> 时分秒：{{ today | date:'HH:mm:ss.sss' }}</li>

<br>数字格式的过滤:<br>
<li>小数点：{{ numberinput |number:2 }}</li>
<li>格式：{{ numberinput |number }}</li>

<br>货币格式的过滤:<br>
<li>默认：{{ numberinput |currency }}</li>
<li>自定义：{{ numberinput |currency:"RMB ￥" }}</li>

<br>filter寻找的过滤:<br>
<li>寻找结果：{{ names|filter:{name:'李四'} }}</li>

<br>对象的截取，获取两个数据:<br>
<li>寻找结果：{{ names| limitTo:2}}</li>

<br>对象的排序:<br><!--最后的参数是true表示降序，false表示的是升序-->
<li>年龄倒叙：{{ names|orderBy:'age':false}}</li>

<br>自定义的filters:<br>
<!--自定义的filter要 app.filter,不是$scope.filter;另外一个不能包含于controller中-->
{{stringContent | replacefilter:'习近平':'大Boss'}}

</div>
</div>
<script type="text/javascript">
var app=angular.module("demo",[]);
app.controller('firstController',function($scope){
$scope.firstName="lYongHong";
$scope.today = new Date();
$scope.numberinput=193;
$scope.stringContent="国际在线报道(记者 杨磊)：2016年两会上，中共中央总书记、国家主席、中央军委主席习近平多次强调，要把脱贫攻坚作为“十三五”时期的头等大事来抓。3月8日,习近平在湖南代表团表示：“坚决守住民生底线，坚决打赢脱贫攻坚战。” 3月10日，习近平在青海代表团强调：“齐心协力打赢脱贫攻坚战，确保到2020年现行标准下农村牧区贫困人口全部脱贫。”";
$scope.names=[
{name:'张三',age:100,country:'usa'},
{name:'李四',age:101,country:'germany'},
{name:'王五',age:89,country:'china'}
]
});
app.filter('replacefilter',function(){
return function(input,sourceName,toName){
return input.replace(sourceName,toName);
};
});
</script>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： angularjs

相关文章推荐

新的分享

章节导航