AngularJS实战之filter的使用一

阅读更多

一、格式化数字为货币格式。

{{money|currency:"$"}}
{{money|currency:"RMB"}}

script：

app.controller("crl", function($scope, $filter) {
		$scope.money="4545";
	});

显示为

二、lowercase 格式化字符串为小写。

姓名为 {{ lastName | lowercase }}

app.controller("crl", function($scope, $filter) {
     $scope.lastName ="AAA";
});

显示为
aaa
三、uppercase 格式化字符串为大写。

姓名为 {{ lastName | uppercase }}

app.controller("crl", function($scope, $filter) {
     $scope.lastName ="aaa";
});

显示为
AAA
四、filter 从数组项中选择一个子集。

	
{{array|filter:"s"}}
	
{{item.name}}

app.controller("crl", function($scope, $filter) {
		$scope.array = [ {
			name : 'Tobias'
		}, {
			name : 'Jeff'
		}, {
			name : 'Brian'
		}, {
			name : 'Igor'
		}, {
			name : 'James'
		}, {
			name : 'Brad'
		} ];
	});

显示为
[{"name":"Tobias"},{"name":"James"}]
Tobias
James
五、orderBy 根据某个表达式排列数组。
输入过滤器可以通过一个管道字符（|）和一个过滤器添加到指令中，该过滤器后跟一个冒号和一个模型名称。模型名字前加负号为降序，默认为升序

降序   {{item.name}}
	
升序     {{item.name}}

app.controller("crl", function($scope, $filter) {
		$scope.array = [ {
			name : 'Tobias',age:"18"
		}, {
			name : 'Jeff',age:"19"
		}, {
			name : 'Brian',age:"19"
		}, {
			name : 'Igor',age:"55"
		}, {
			name : 'James',age:"19"
		}, {
			name : 'Brad',age:"19"
		} ,{
			name : 'aaas',age:"19"
		}];
	});

显示为
降序 Tobias
降序 Jeff
降序 James
降序 Igor
降序 Brian
降序 Brad
降序 aaas
升序 aaas
升序 Brad
升序 Brian
升序 Igor
升序 James
升序 Jeff
升序 Tobias
5.1.多个模型排序（先按名字排序在按年龄排序）

升序     {{item.name}}{{item.age}}

app.controller("crl", function($scope, $filter) {
		$scope.array = [ {
			name : 'Tobias',age:"18"
		}, {
			name : 'Jeff',age:"19"
		}, {
			name : 'Brian',age:"19"
		}, {
			name : 'Igor',age:"55"
		}, {
			name : 'James',age:"19"
		}, {
			name : 'adsd',age:"19"
		} ,{
			name : 'adsd',age:"20"
		}];

	});

显示为
升序 adsd19
升序 adsd20
升序 Brian19
升序 Igor55
升序 James19
升序 Jeff19
升序 Tobias18

• 
• 大小: 2.1 KB

• 查看图片附件