angular-管道

管道其实是一些简单的函数，可以在模板表达式中用来接受输入值，并返回一个转换后的值。
管道分为内置管道和自定义管道两种。
内置管道比较简单，可以直接拿来用，比如日期格式化、金额格式化、数字格式化等等。

//{最小整数位}.{小数点后的最小位数}-{小数点后的最大位数}
{{3.1415926 | number:'2.1-3' }} //03.1

下面说一下如何自定义管道。
首先利用命令生成一个管道，这个管道的作用很简单，就是切割字符串。

ng g pipe pipes/cutstr

cutstr.pipe.ts:

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

@Pipe({
  name: 'cutstr' //模板中使用的管道名称{{xxx | cutstr:1}}
})
export class CutstrPipe implements PipeTransform {

  transform(value: string, ...args: number[]): string {
    console.log(value);//接收数据
    console.log([...args]);//多个参数用冒号间隔开
    let arr = [...args];
    return arr[1] ? value.substring(arr[0],arr[1]) : value.substring(arr[0]);
  }

}

测试：

 {{'123456789' | cutstr:1:3}}