類(lèi)似vue的過(guò)濾器 filter
內(nèi)置管道
<p>{{birthday | date}}</p> //Jul 17, 2019
<p>{{birthday | date:'yyyy-MM-dd'}}</p> //2019-07-17
<p>{{name | uppercase}}</p> //ZLB
<p>{{name | uppercase | lowercase}}</p> //zlb
自定義管道
ng g pipe test
快速生成
auth=[1,2,3];
<li *ngFor="let item of auth">{{item |test}}</li>
管理員
客服
普通用戶(hù)
import {Pipe, PipeTransform} from '@angular/core';
@Pipe({
name: 'test'
})
export class TestPipe implements PipeTransform {
transform(value: number, ...args: any[]): any {
switch (value) {
case 1:
return '管理員';
break;
case 2:
return '客服';
break;
case 3:
return '普通用戶(hù)';
break;
}
}
}
在app.modules中的declarations
引入TestPipe