angular 自定义管道

1.新建ts文件
2.引入 Pipe,PipeTransform
import { Pipe, PipeTransform } from '@angular/core';
Pipe 是“管道元数据(pipe metadata)”装饰器的类。
PipeTransform 是 用来实现 transform 方法
3.实现
1> import { Pipe, PipeTransform } from '@angular/core';
2> @Pipe({name: 'guandao'}) // 装饰器 定义管道的名字
3>export class GuandaoPipe implements PipeTransform//类声明实现PipeTransform
4>transform 方法
transform(value: string): string {

return value

}
// 接受参数 可多个
5>再入口文件 进行引入
import { GuandaoPipe } from '文件路径';
declarations:[GuandaoPipe]
exports:[GuandaoPipe]
6> html使用

{{msg | guandao}}


如果需要传入参数

{{msg | guandao:arg1:agr2}}


transform(value:string,arg:string,arg:string)

value 就是html里面的msg arg1,arg 就是增加的参数
这样就可以在transform中写入自己想要的逻辑 来实现管道

你可能感兴趣的:(javascript,angular2)