angular管道

# 1：内置管道

---

date  |  json  |  uppercase    |   lowercase  |  number    |    currency   |    percent   |     slice

---

No 1：number:[整数部分保留最小位数].[小数部分保留最小位数-最多位数]

          {{price | number:'3.2-4'}}

No 2：currency:currencyCode:symbolDisplay:小数点

         {{price | currency:'USD':true:'3.4'}}

No 3：percent：小数点

        {{value | percent}}

        {{value | percent:'3.4'}}

No 4：date  【H：24制    h：12制】

        {{ birthday | date: 'yyyy-MM-dd HH:mm-ss' }}

No 5：async 解包一个异步的可观测流

---

# 2：自定义管道

---

《 demo18.pipe.ts》：

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

@Pipe({

name:'myCurrency'

})

export class Demo18Pipe implements PipeTransform{//接口

transform(value: any, ...args: any[]): any {

 return null;  //必须有返回值

//value管道操作符前面传来的原始值   ...args  参数值【可选】

}

}

在模块中 声明管道：

import {Demo18Pipe} from '...'

@NgModel({

delcarations : [Demo18Pipe]

})

调用管道：

{{ expression | myCurrency}}

---