1.命令行新建一个管道:放在项目里pipe文件夹里

ng  g pipe  pipe/multiple

新建管道之后就声明在app.module.ts文件里了

Angular自定义管道方法

2.multiple.pipe.ts示例

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

@Pipe({
  name: 'multiple'
})
export class MultiplePipe implements PipeTransform {

  transform(value: any, args?: any): any {
    //ages是管道的参数,可为空
    if(!args){
      args = 1;
    }
    return value * args;
  }
}

 3.在视图模板使用示例:

<p>测试管道用法:{{size | multiple : '2'}}</p>

 

相关文章: