Angular中ngOnChanges与Pipe的适用场景对比

这个问题我当初刚接触Angular的时候也纠结过，踩过几次坑后慢慢摸出了一些判断的门道，分享给你：

优先选择Pipe的场景 #

• 纯函数式的无副作用处理：如果你的数据处理逻辑是纯函数——相同输入一定得到相同输出，不依赖组件外部状态、不会修改任何变量或触发异步操作（比如日期格式化、数字千分位显示、字符串截断、数组过滤排序），优先用Pipe。Angular的纯Pipe会自动缓存计算结果，只有输入值发生变化时才会重新执行，性能更优，而且可以在多个组件里复用，不用重复写处理代码。
• 仅用于模板展示的简单转换：如果处理后的数据只需要在模板里渲染，用Pipe能让模板代码更简洁直观。比如{{ user.joinDate | date:'yyyy-MM-dd' }}，比在组件里写个方法或者在ngOnChanges里存变量再渲染清爽太多。
• 不想修改原始输入数据：Pipe是返回一个处理后的新值，不会改动传入的@Input原始数据，适合只做展示转换的场景，避免意外污染原始数据。

优先选择ngOnChanges的场景 #

• 带有副作用的处理逻辑：如果你的数据处理需要依赖外部状态（比如组件里的其他属性、服务中的数据），或者有副作用（比如调用API请求数据、修改组件内部变量、触发其他业务操作），必须用ngOnChanges。因为Pipe设计上应该是纯的，不能包含异步或状态变更的操作，否则会导致不可预期的问题。
• 处理后的数据需要在组件内部复用：如果处理后的结果不仅要在模板展示，还要在组件的其他方法（比如点击事件、表单提交）中使用，那在ngOnChanges里把处理结果存在组件的属性里会更方便，不用每次在方法里重复执行处理逻辑。
• 多输入联动的复杂处理：如果组件有多个@Input，它们的变化需要协同处理（比如输入A和输入B同时变化才重新计算结果），ngOnChanges可以通过SimpleChanges对象获取所有变化的输入，能更灵活地控制执行时机，而Pipe虽然支持多参数，但逻辑复杂时可读性和可控性不如ngOnChanges。
• 需要精细控制性能的复杂场景：如果处理逻辑计算量很大，或者输入是复杂对象/数组（纯Pipe默认浅比较，引用不变的话即使内部属性变化也不会重新计算），这时候用ngOnChanges可以手动对比新旧值的深层变化，决定是否重新执行处理，比用不纯Pipe（每次变更检测都会执行，性能差）更高效。

一句话总结 #

简单来说：纯展示、无副作用、可复用的格式化/转换逻辑用Pipe；有副作用、需要联动多输入、处理后的数据要在组件内部复用的用ngOnChanges。

内容的提问来源于stack exchange，提问作者user1059939