angular6.0+ 自定义管道

以身份证号的部分隐藏为例，话不多说，来看代码；

ng generate pipe pipes/IdNumber

在IdNumber中定义管道：

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({ name: 'idNumber' })

export class IdNumberPipe implements PipeTransform {
      transform(value): string {
            let idCard = value.replace(/(^\d{6}|\d{3})(\d{10})(\d{1})(\d{1}|X$)/, "$1**********$3$4");
            return idCard;
      }
}

然后在你需要的地方的 xxxx.module.ts中引入；
如下：

import { IdNumberPipe } from '../../pipes/IdNumberPipe';

并在@NgModule的 declarations中声明；
如下：

@NgModule({
  declarations: [
    OrderDetailsPage,
    IdNumberPipe
  ],
  providers: [
  ],
  imports: [
    IonicPageModule.forChild(OrderDetailsPage),
  ],
})

OK，现在你可以在HTML文件中用了，

<div class="idcard">{{order.idNumber | idNumber }}</div>