angular2 学习笔记 (Pipes)
更新 : 2019-09-01
number 和 currency pipe
当我们要出美美的数字的时候就会用到了。
什么叫美美 ?
比如十万, 100000 or 100,000
哪个好一点 ? 后的丫,有逗号隔开了密密的 0
这时候就要使用 | number 了
最常用的是 | number: '0.2-4', 意思是小数点前面最少一个数字, 小数点后最少 2 个最多 4 个数字.
| currency: 'RM': 'symbol' : '0.2-4'
Pipe 就是 ng1 的 filter
<pre>{{ jsonValue | json }}</pre>
用法看这里就很清楚了 : https://angular.cn/docs/ts/latest/guide/pipes.html
要记得 pipe 尽量用 pure 的 (ng1 叫 stateful)
pure 只有在 value changed 才会触发 ( object, array 的话要换引用哦 )
如果要用 impure 的话 (比如做 curreny convert or translate) 要自己 take care 性能哦.
async pipe
{{ value$ | async | myPipe }}
今天 async pipe 后面又接了自己的 pipe, 结果发现 async 还是很聪明的, 给我的是值而不是 Obserable. 嘻嘻,我多虑了.
angular2 学习笔记 (Pipes)的更多相关文章
- Angular2学习笔记(1)
Angular2学习笔记(1) 1. 写在前面 之前基于Electron写过一个Markdown编辑器.就其功能而言,主要功能已经实现,一些小的不影响使用的功能由于时间关系还没有完成:但就代码而言,之 ...
- Angular2学习笔记——NgModule
在Angular2中一个Module指的是使用@NgModule修饰的class.@NgModule利用一个元数据对象来告诉Angular如何去编译和运行代码.一个模块内部可以包含组件.指令.管道,并 ...
- angular2 学习笔记 ( rxjs 流 )
RxJS 博大精深,看了好几篇文章都没有明白. 范围牵扯到了函数响应式开发去了... 我对函数式一知半解, 响应式更是第一次听到... 唉...不过日子还是得过...混着过先呗 我目前所理解的很浅, ...
- angular2 学习笔记 ( ngModule 模块 )
2016-08-25, 当前版本是 RC 5. 参考 : https://angular.cn/docs/ts/latest/guide/ngmodule.html 提醒 : 这系列笔记的 " ...
- Angular2学习笔记(1)——Hello World
1. 写在前面 之前基于Electron写过一个Markdown编辑器.就其功能而言,主要功能已经实现,一些小的不影响使用的功能由于时间关系还没有完成:但就代码而言,之前主要使用的是jQuery,由于 ...
- Angular2学习笔记——路由器模型(Router)
Angular2以组件化的视角来看待web应用,使用Angular2开发的web应用,就是一棵组件树.组件大致分为两类:一类是如list.table这种通放之四海而皆准的通用组件,一类是专为业务开发的 ...
- Angular2学习笔记——Observable
Reactive Extensions for Javascript 诞生于几年前,随着angular2正式版的发布,它将会被更多开发者所认知.RxJs提供的核心是Observable对象,它是一个使 ...
- Angular2学习笔记——在子组件中拿到路由参数
工作中碰到的问题,特此记录一下. Angular2中允许我们以`path\:id\childPath`的形式来定义路由,比如: export const appRoutes: RouterConfig ...
- angular2 学习笔记 ( Form 表单 )
refer : https://angular.cn/docs/ts/latest/guide/forms.html https://angular.cn/docs/ts/latest/cookboo ...
随机推荐
- C# 自动登录网页,浏览页面【转载】
需求:客户的数据同时存在在另外一个不可控的系统中,需要和当前系统同步. 思路:自动登录另外一个系统,然后抓取数据,同步到本系统中. 技术点:模拟用户登录:保存登录状态:抓取数据 /// <sum ...
- HTML5游戏开发技术基础整理
随着HTML5标准终于敲定.HTML5将有望成为游戏开发领域的的热门平台. HTML5游戏能够执行于包含iPhone系列和iPad系列在内的计算机.智能手机以及平板电脑上,是眼下跨平台应用开发的最佳实 ...
- MySQL 的 read_buffer_size 参数是如何影响写缓冲和写性能的?
Each thread // that does a sequential scan . The value of this variable should be a multiple of 4KB. ...
- MySQL——修改root密码的4种方法(以windows为例)
方法1: 用SET PASSWORD命令 首先登录MySQL. 格式:mysql> set password for 用户名@localhost = password('新密码'); 例子:my ...
- 【nodejs】创建udp套接字的类型参数的含义
nodejs在创建udp套接字的时候,需要传入一个类型参数.有两种类型参数可供选择:udp4和udp6.udp4对应的就是ipv4,udp6对应的是ipv6.
- 9.22 noip模拟试题
水灾(sliker.cpp/c/pas) 1000MS 64MB 大雨应经下了几天雨,却还是没有停的样子.土豪CCY刚从外地赚完1e元回来,知道不久除了自己别墅,其他的地方都将会被洪水淹没. CCY ...
- jquery ui 插件------------------------->sortable
<!doctype html><html lang="en"><head> <meta charset="utf-8" ...
- java String对象的创建(jvm).
本人目前也开始学习虚拟机,在java中,有很多种类型的虚拟机,其中就以sum公司(当然现在已经是oracle了)的虚拟机为例,介绍可能在面试的时候用到的,同时对自己了解String有很大帮助,这里仅仅 ...
- [笔记]SD卡相关资料
ESD静电放电模块 我知道的flash分为两种NOR flash和NAND flash,NOR falsh容量一般为1~16M用于单片机代码存储,NAND flash最小的是8M最大的现在听说有90G ...
- C# Dll动态链接库
新建一个类库. 2 编写一个简单的类库实例,例如:DllTest在默认名为:calss1.cs里编写代码一下是一个简单的:在控制台显示 “你以成功调用了动态连接!”sing System;us ...