angular - 方法与管道

Question

在 Angular 应用程序的模板插值中使用管道和方法有区别吗？

例如:

<h1>{{ name.toLowerCase() }}</h1>对比<h1>{{ name | lowercase }}</h1>

在性能方面，有真正的收获还是只是个人喜好？

我知道在你的模板中调用方法通常会降低性能，因为 Angular 会不断检查它的执行是否有任何改变。大多数时候，我会在我的组件上使用计算属性。

Answer 1

TL;DR; 不要在模板中使用函数或方法，而是使用管道。

管道只有在输入值改变时才会被调用。每次更改检测都会调用一个函数或方法。 Here is a nice article如果您想进一步了解模板中的函数。

Here is a running stackblitz demonstration of method vs pipe.