1、使用ng g pipe pipe/mySex创建了一个名叫mySex的管道文件
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'mySex'
})
export class MySexPipe implements PipeTransform {
//管道内默认的处理函数，在模板中使用默认调用transform函数，传入旧值，return过滤后的值
transform(value: unknown): unknown {
if (value==1) {
return '男'
}else if (value==2) {
return '女'
}else{
return '太监'
}
}
}
2、在页面中使用
// 在页面中使用的是使用管道装饰器声明的管道名
{{'1'|mySex}}//通过管道过滤为男
{{'2'|mySex}}//通过管道过滤为女
{{'3'|mySex}}//通过管道过滤为太监
3、管道定义时也可以传入另外的参数
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'mySex'
})
export class MySexPipe implements PipeTransform {
//管道内默认的处理函数，在模板中使用默认调用transform函数，传入旧值，return过滤后的值
transform(value: unknown,lang='zh'): unknown {
if(lang=='zh'){
if (value==1) {
return '男'
}else if (value==2) {
return '女'
}else{
return '太监'
}
}
}else if(lang=='en'){
//do something
}
}
//在模板上调用时使用
{{'1'|mySex:'en'}}//en为传参
