纯管道和非纯管道是相对于管道所传的参数（如上例的 filterKey）而言的。如果管道是纯管道，只监听基本类型的参数的变化或者引用类型引用的变化（ a primitive input value (
String,Number,Boolean,Symbol) or a changed object reference (Date,Array,Function,Object)）；然而， 对于非纯管道，不管是基本类型参数的改变还是引用类型内部数据变化（而非引用变化）都可以触发管道。
@Pipe({ name: 'yourPipeName', pure: true // default（纯管道：监听基本类型的参数的变化或者引用类型引用的变化） })
@Pipe({ name: 'yourPipeName', pure: false //（非纯管道：监听所有情况的变化） })
实验对比
app.component.html
<h1>纯管道：{{obj | moneyPurePipe }}</h1> <h1>非纯管道：{{obj | moneyImpurePipe }}</h1> <input type="text" [(ngModel)]=obj.text>
app.component.ts
obj={ text :123456.123456 };
创建两个管道moneyPurePipe和moneyImpurePipe
ng g p moneyPurePipe ng g p moneyImpurePipe
money-pure-pipe.pipe.ts
import { Pipe, PipeTransform } from '@angular/core'; @Pipe({ name: 'moneyPurePipe', pure: true // default（纯管道：监听基本类型的参数的变化或者引用类型引用的变化） }) export class MoneyPurePipePipe implements PipeTransform { transform(value: any, ...args: any[]): any { if (value) return (args[0] || '') + parseFloat(parseFloat(value.text).toFixed(2)).toLocaleString() + (args[1] || ''); else return 0; return null; } }
money-impure-pipe.pipe.ts（仅仅只有pure:false的差异）
import { Pipe, PipeTransform } from '@angular/core'; @Pipe({ name: 'moneyImpurePipe', pure: false//（非纯管道：监听所有情况的变化） }) export class MoneyImpurePipePipe implements PipeTransform { transform(value: any, ...args: any[]): any { if (value) return (args[0] || '') + parseFloat(parseFloat(value.text).toFixed(2)).toLocaleString() + (args[1] || ''); else return 0; return null; } }
运行看效果
发现了吗？当obj.text发生变化的时候，只有非纯管道监听了数据变化
额外的，如果不想用非纯管道也要能够监听obj的变化，可以采用直接绑定对应的属性名
<h1>纯管道：{{obj.text | moneyPurePipe }}</h1>
直接绑定obj的text属性，对moneyPurePipe管道稍作修改，只监听数值也能达到非纯管道的功效~
只不过这种pipe扩展性就不大了，根据自己项目需求来调整吧~
