Angular:管道和自定义管道
①管道的使用,更多管道在angular官网上有
<p>全部转为大写:{{'hahahah' | uppercase}}</p> <p>保留两位小数:{{1.45555 | number:'1.1-2'}}</p>
②自定义管道
1、使用ng g pipe创建一个管道类文件
2、对pipes/pow.pipe.ts文件进行改造
import { Pipe, PipeTransform } from '@angular/core'; @Pipe({ name: 'pow' }) export class PowPipe implements PipeTransform { transform(value: number, exponent?: number): number { //第二个参数还可以为...arg:unknown[]: return Math.pow(value, isNaN(exponent) ? 1 : exponent); //求传入数值的多少次方 } }
3、组件中使用
<!-- 页面显示结果为8 --> <p>{{2 | pow:3}}</p>