Angular 9 系列（四）自定义 Pipe 管道

小渣渣

Angular 9 系列（一）动态加载组件
https://www.itsvse.com/thread-9238-1-1.html

Angular 9 系列（二）动态组件传参
https://www.itsvse.com/thread-9245-1-1.html

Angular 9 系列（三）订阅动态组件事件
https://www.itsvse.com/thread-9246-1-1.html

Angular 9 系列（四）自定义 Pipe 管道
https://www.itsvse.com/thread-9248-1-1.html

Angular 9 系列（五）格式化金额货币格式
https://www.itsvse.com/thread-9249-1-1.html

Angular 尽管内置许多的pipe，比如date、async、currency等。尽管拿来即用，但是远不能满足于业务的一些需求，所以需要实现自定义的一些pipe。

最基础的自定义pipe就是接收一个value，然后返回另外一个value。参数的形式不限，可以是string、number、object等任何类型。

在默认日期格式化管道，就无法满足我们的需求。

接口返回的json结果：

{"statusDate":"0001-01-01T00:00:00" ...}

这是由于，我们.net core序列化对象，对于datetime类型空的字段，附上默认值，默认值就是 DateTime.MinValue。



我们使用

登录可见。

会显示

01-Jan-0001

我们的需求是，如果返回的datetime类型的字段，如果为空，也就是为“0001-01-01T00:00:00”，需要返回 NA。

我们通过angular-cli命令新建一个管道，命令如下：

登录可见。

代码如下：

登录可见。

新建完成后， app.module.ts 文件会自动添加如下代码：

登录可见。

我们重新在 html 页面使用新的管道，如下：

登录可见。

就会返回，我们想要的结果，如下图：



备注：向 pip 传递参数使用 : 分分割。

Song300

学习！！！！！！！！！！！