angular过滤器的使用和自定义过滤器

最新推荐文章于 2021-10-20 08:44:18 发布

sdfujichao

最新推荐文章于 2021-10-20 08:44:18 发布

阅读量1.4k

点赞数 2

分类专栏： angularJS 文章标签： angular的过滤器使用

本文链接：https://blog.csdn.net/sdfujichao/article/details/51967107

版权

angularJS 专栏收录该内容

23 篇文章 0 订阅

订阅专栏

过滤器的使用。一种是在html中的使用，一种是在js代码中的使用。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>过滤器</title>
		<script src="day2/src/angular.js"></script>
		<style type="text/css">
		</style>
	</head>
	<body>
		
		<div ng-app="fristApp">
			<div ng-controller="fristController">
				
				<!--多个过滤器之间用 | 链接-->
				
				<!--参数的实质就是把参数添加在数字前面（在货币符号处使用）-->
				{{money | currency}}<br />
				{{money | currency:'￥'}}<br />
				
				{{str | uppercase}}<br />
				{{json | json}}<br />
				
				<!-- 会进行四舍五入-->
				{{num | number:3}}<br />
				
				<!--时间 只有MM是大写-->
				{{currenttime | date:'yyyy-MM-dd-hh'}}
				
				<!--字符串的切割-->
				{{strr | limitTo:3}}
				{{strr | limitTo:-3}}
				
				<!--按照person的age进行排序-->
				<ul>
					<li ng-repeat="person in arr | orderBy:'age':false">
						{{person.name}}
					</li>
				</ul>
				
				<!--true 位于第二个位置，其中num是不能加“”的，上面的加“”是因为name是他的一个属性-->
				<ul>
					<li ng-repeat="n in [2,43,432,453,65] | orderBy:num:true">
						{{n}}
					</li>
				</ul>
				
				
				<!--根据person的属性进行过滤-->
				<input type="text" ng-model="name" />
				<ul>
					<li ng-repeat="person in arr | filter:{'name':name}">
						{{person.name}}
					</li>
				</ul>
				
				
			</div>
			
		</div>
	</body>
	<script type="text/javascript">
		var myApp = angular.module('fristApp',[]);
		myApp.controller('fristController',function($scope,$filter){
			$scope.money = 100;
			$scope.str = "fsHIOiiiiIU"	;
			$scope.json = {name:"zhangsan",age:40};
			$scope.num = 12432432432;
			var time = new Date();
			$scope.currenttime = time.getTime();
			
			$scope.strr = "fujichao";
			
			$scope.arr = [
				{name:'zhangsan',age:33},
				{name:'zhangsan2',age:30},
				{name:'zhangsan3',age:44},
				{name:'zhangsan4',age:3}
			];
			
			
			// 如果数组的元素相等的话，这两个元素的内存地址是相同的。
			var arrnum = [12,12,33,44];
			if(arrnum[0]===arrnum[1]){
				console.log("fji")
			};
			
			/* 在JS中使用过滤器*/
			
			// $filter(过滤器的名字)(对象，条件)
			var val =  $filter('currency')($scope.money,'￥');
			console.log(val);
			
			var string1 = "fssdHIUHIjiojjOIJIOJ"
			var valStr = $filter('uppercase')(string1);
			console.log(valStr)
		})
	</script>
</html>

sdfujichao

关注

2
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
angular过滤器的使用和自定义过滤器

过滤器的使用。一种是在html中的使用，一种是在js代码中的使用。过滤器 {{money | currency}} {{money | currency:'￥'}} {{str | uppercase}} {{json | json}}
复制链接

扫一扫

专栏目录