angular之自定義管道
阿新 • • 發佈:2017-08-20
pan code 參數 angular log core pipe cor 替換
1,裝了angular2 的 cli之後,cmd中命令建立個管道文件 ng g p <name>;
如建一個在pipe文件中建一個add.pipe.ts文件 可以這麽麽寫 ng g p pipe/add;
2, add.pipe.ts內容如下:
//原始內容
import { Pipe, PipeTransform } from ‘@angular/core‘; @Pipe({ name: ‘add‘ }) export class AddPipe implements PipeTransform { transform(value: any, args?: any): any {return null; } }
//修改transform裏面的內容如下:
transform(value: any, arg1: any,arg2: any): any {
return value;
}
3,如將上面的管道用到 html 上;
如下寫法
<ul *ngFor="let item of items | add:‘fang‘:true"> <li>{{item}}</li> </ul>
4,看第三步參數分別代表
第一個參數value 為items;
第二個參數arg1 為 ‘fang’;
第三個參數arg2 為true;
後面返回的數就會替換itemes
5, 記得使用時要聲明;將其加到 declarations數組裏
angular之自定義管道