pipe

1. 首页
2. pipe

Angular 2 + 折腾记 ：(5) 动手实现一个自定义管道

前言管道的常规使用一般是用于Mustache语法的双向数据内，eg:{{item|json}}上面的例子是用了内置的JsonPipe管道。。，eg:{{item|slice:0:4}}管道后面冒号跟随的就是参数,也许还有人问如何多重管道调用？，eg:{{item|slice:0:4|uppercase}}这里看出来了么，这是使用了数据流的概念，用过linux管道的小伙伴一看就知道了。。item的输入数据给slice处理后再丢给uppercase处理，最终返回的结果集就是切割后并且转为大写字符的数据书写一个

Angular 2 Pipe vs Angular 1 Filter

一直想写关于Angular1.x与Angular2.x区别的文章，方便Angular1.x的用户快速的过渡到Angular2.x。英文好的同学，建议直接阅读CreatingacustomfilterinAngular原文哈，因为我并不打算完整地翻译。目录Angular1.xCreatingacustomfilterUsingfiltersintemplatePassingargumentstofiltersFilteringinControllerswith$filter()Angular2Creatin

angularjs2 ionic2 备忘

因为angular2中创建pipe之后，在app.module里面声明一下，全局可用，但是ionic2的每个page都是独立的module，要在page中直接使用pipe就不可行了，而且不能在page.module中再去import那个pipe,会报pipe再不同模块中引用的错误，因此，我们可以将pipe整个声明为一个module，在需要pipe的地方，将整个module引入。pipe.module的声明具体的pipe实现不贴出了，就是angular2的实现方式需要引用pipe的地方

处理angular2关于date格式化浏览器不兼容的问题

在使用angular2的过程中使用自带时间格式化pipe会在Safari浏览器报错，针对这一问题，我们可以参考下属代码，自定义格式化pipe在上述代码中我们引用了专门操作时间类信息工具moment.js

创建一个ng2组件库开发工程

目标创建一个基于angular2的组件开发工程，在此工程可以实现组件打包，组件演示；目录结构图步骤1、利用angular2-cli脚手架创建一个默认工程；2、修改package.json如下：3、修改tsconfig.json如下：4、根目录新建tsconfig-aot.json如下：5、根目录下创建gulpfile.js文件，内容如下：6、接下来再重点看下app下面的两个文件夹：components存放组件相关代码，showcase存放组件演示代码；7、命令行运行npminstall安装全部依赖，到这里

angular4学习记录 -- 数据绑定、响应式编程、管道

我们通过@Pipe装饰器告诉Angular：这是一个管道。该装饰器是从Angular的core库中引入的。这个@Pipe装饰器允许我们定义管道的名字，这个名字会被用在模板表达式中。它必须是一个有效的JavaScript标识符。非纯管道速度超慢，深度检测，会频繁检测。

Angular2 管道 pipe

ng2内置了很多管道，比如DatePipe、UpperCasePipe、LowerCasePipe、CurrencyPipe和PercentPipe，可以直接在任何模板中使用。本文重点讲解自定义管道，点击观看更多管道知识我们项目中经常需要将时间转换，但是ng2中所带的Datapipe并不合适，因为要转换为中文，比如时间转换为刚刚，1小时前，一天前，一周前等等，这时候就需要自定义管道。

《Angular4之解决构建包过大问题》

正文：提高性能方案：1.借助Nginx,使用gzip压缩，2.从带宽考量，lvs替代Nginx3.angular4升级为5，在进行升级研究时遇到问题，继而此方案搁置4.使用代码自动构建工具gulp,将构建包的css/html/js/images压缩。第五步：新建gulpfile.js文件整体结构：结果：脚手架升级之前，构建包为53MB左右，升级为1.6.1之后，构建包为35MB左右，使用gulp压缩，构建包为23MB左右，前后对比，文件体积缩小了将近一倍哦，根据压测结果，在访问速度上由12秒，减少到了3、