angular-过滤器

过滤器	描述
currency	格式化数字为货币格式。
filter	从数组项中选择一个子集。
lowercase	格式化字符串为小写。
orderBy	根据某个表达式排列数组。
uppercase	格式化字符串为大写。

内容中：数值转为货币格式

<p>总价 = {{ (quantity * price) | currency }}</p>

排序

<ul><li ng-repeat="x in names | orderBy:'country'">{{ x.name + ', ' + x.country }}</li>
</ul>

内容中：转小写

<p>姓名为 {{ lastName | lowercase }}</p>

内容中：转大小写

<body ng-app="myApp"><div ng-controller="myCtrl"><input type="text" ng-model="name"/><input type="text" ng-model="age"/><!--z转换为大/小写--><!--<p>调用控制器里的函数：{{info()|uppercase}}</p>--><p>调用控制器里的函数：{{info()|lowercase}}</p></div><script type="text/javascript">var app=angular.module('myApp',[]);app.controller("myCtrl",function($scope){$scope.name="Youyuanyuan";$scope.age=10;$scope.info=function(){//注意变量前加上$scopereturn $scope.name+" "+$scope.age;}})</script></body>

排序：在ng-repeat之后

{{x}}
{{x.name+" "+x.age}}

<body ng-app="myApp"><div ng-controller="myCtrl"><input type="text" ng-model="name" /><input type="text" ng-model="num" /><p>{{"名称："+name+"，单价："+price+"，数量："+num}}</p><p>总价：{{ (price * num) | currency }}</p></div><ul ng-controller="myCtrl"><!--数组排序--><li ng-repeat="x in sum|orderBy">{{x}}</li></ul><ul ng-controller="myCtrl"><!--对象排序--><li ng-repeat="x in info|orderBy:'age'">{{x.name+" "+x.age}}</li></ul><script type="text/javascript">var app = angular.module('myApp', []);app.controller("myCtrl", function($scope) {$scope.name = "apple";$scope.num = 10;$scope.price = 20;$scope.sum =[10,30,20];$scope.info=[{name:"youyunayuan",age:20},{name:"youqijia",age:30},{name:"youlonglong",age:10},{name:"zhengshaonong",age:5}];})</script></body>

转载于:https://www.cnblogs.com/sakura-sakura/p/6678836.html

angular-过滤器相关推荐

Angular过滤器
Angular过滤器在HTML中的模板绑定符号{{ }}内通过|符号来调用过滤器.例如,假设我们希望将字符串转换成大写,可以对字符串中的每个字符都单独进行转换操作,也可以使用过滤器: {{ nam ...
3、Angular JS 学习笔记 – Controllers [翻译中]
2019独角兽企业重金招聘Python工程师标准>>> 理解控制器在Angular中,一个控制器是一个javascript构造函数用于填充Angular作用域. 当一个控制器通过使 ...
js中的实例（排行榜）
1. js 比较两个日期的大小(6469) 2. js 常用正则表达式(4385) 3. js 对象转数组(4058) 4. js 时间戳转换为'yyyy-MM-dd hh:mm'格式(es6语法)( ...
l10n php download,AngularJs 国际化（I18n/L10n）详解
一.I18n and L10n in AngularJS 1. 什么是I18n和L10n? 国际化(Internationalization),简称I18n,是让产品开发在一个他们可以简单地对产品进行 ...
如何使用多个参数调用Angular.js过滤器？
本文翻译自:How do I call an Angular.js filter with multiple arguments? As from the documentation , we can ...
angular货币过滤_Angular过滤器
内置过滤器 1.currency(货币处理) currency可以将数字格式转化为货币的形式,如果不传参数,默认为$. 1 {{num|currency:\"￥\"}} 展现的形式 ...
Angular自定义管道（过滤器）方法
1.命令行新建一个管道:放在项目里pipe文件夹里 ng g pipe pipe/multiple 新建管道之后就声明在app.module.ts文件里了 2.multiple.pipe.ts示例 i ...
angular初步认识一
最近比较流行MVC前端框架开发,最近研究了一个框架AngularJS框架不说那么多,先上例子,我是个代码控 <!DOCTYPE html> <html lang="en& ...
【AngularJS】—— 9 自定义过滤器
AngularJS另一个特点就是提供了过滤器,可以通过操作UNIX下管道的方式,操作数据结果. 通过使用管道,可以便于双向的数据绑定中视图的展现. 过滤器在处理过程中,将数据变成新的格式,而且可以使用 ...
Angular 2 Pipe
Angular 2 Pipe Angular 2 中 Pipe(管道) 与 Angular 1.x 中的 filter(过滤器) 的作用的是一样的.它们都是用来对输入的数据进行处理,如大小写转换.数值 ...

angular-过滤器

内容中：数值转为货币格式

排序

内容中：转小写

内容中：转大小写

排序：在ng-repeat之后

angular-过滤器相关推荐

最新文章

热门文章