今天完成的事情： angular 管道； angular 的指令

明天计划的事情：路由传参页面跳转；为分页器绑定事件，点击获取页码，传值给路由；完善页面的零部件

遇到的问题：angular 的管道用的还不是太灵活；不会将多个方法管道写在一个 ts 中，，

收获：

angular pipe 管道：

管道用来对字符串、货币金额、日期和其他显示数据进行转换和格式化。管道是一些简单的函数，可以在模板表达式中用来接受输入值并返回一个转换后的值。例如，你可以使用一个管道把日期显示为 1988 年 4 月 15 日，而不是其原始字符串格式。

pipe类似过滤器，比如，在一个字符串要展现在页面之前，

我们需要对这个字符串进行一些操作，比如：将字符串转化为大写，加一个前缀/后缀……

Pipe的作用就是来实现类似的需求

主要存在两种类型的管道，pure pipe(无状态管道)和impure pipe(有状态管道)
我们将pure标志赋值为false，可以声明管道为impure类型。我们将pure标志赋值为false，可以声明管道为impure类型。

• 无状态管道，当输入没有变化时，Angular2框架不会重新计算管道的输出。
• 有状态管道，Angular2框架在每个变化检查周期都执行 管道的transform()方法。

pipe管道创建：ng g pipe 输入后会提示输入名称在定义名称就可以了。默认生成在app目录下，和根模块相同目录。也可以直接输入ng g p 管道名字；pipe名称可以带有路径，如pipes/pipename 这样就会在src/app目录生成pipes目录，并在齐目录下生成文件pipename.pipe.ts

 还没搞懂怎样在一个文件中写多个管道方法，就用的一个文件写一个方法。（慢慢发掘，这样写肯定不行）

下面写的是获取的后端数据渲染时的写法（因为数据类型问题，就需要用到管道来将获取到数据进行转变，）：

上面的代码利用管道就是所展现出的就是发布时间、修改时间及状态。本来获取到的数据是一组组数组，所以需要用到管道来实现可以显现出的内容。

angular 指令：

在 Angular 中有三种类型的指令：

1. 组件： 拥有模板的指令,例如：<yunzhi-data-list> </yunzhi-data-list>
2. 属性型指令： 改变元素、组件或其它指令的外观和行为的指令,上面的nz-row,nz-col就是这类指令
3. 结构型指令： 通过添加和移除 DOM 元素改变 DOM 布局的指令，例如：*ngFor,*ngIf

这三种指令中最常用的就是组件。

自定义属性型指令

使用指令实现给html元素绑定背景色：

先生成指令类文件，同生成组件一样，使用CLI命令即可：ng generate directive highlight

使用指令：

selector 选择器：

如果我写的指令不想被人乱用，比如上述指令我只想在button中生效，就要用到指令的选择器（selector）。

我们命令生成指令文件后会有如下默认的代码段：

这个selector里的字符串就是我们使用指令绑定到宿主元素的规则。实例化指令对象的规则

如果我想只绑定给button，就可以这样写：当我绑定到其他元素时，编译器就会报错