angular.courses
DIOP0301PerformanceCI gate

Method call in a template binding

A component method is called inside an interpolation, a property binding, a structural directive or a control-flow head, so it runs on every change-detection pass.

What it means

Angular cannot know whether a method's result changed, so it calls it again each time the view is checked: on every event, every timer, every HTTP response with the default strategy. A cheap method becomes expensive at scale, and an expensive one freezes the UI.

The scan pairs each template with its component class, so signal reads (count()), $any(), @for track expressions and zero-argument member calls on services are left alone.

How to fix it

Compute the value once: a computed() signal, a pure pipe, or a property updated when its inputs change. For calls with arguments, memoize on the arguments or move the computation into the data layer.

What it looks like

As printed by diopter check; the UI and the Markdown report show the same finding with its location.

[DIOP0301] `isValid(form)` runs on every change-detection pass in EditorComponent (src/app/editor/editor.component.html:24:19).
  fix: Compute the value once instead: a computed() signal, a pure pipe, or a property updated when its inputs change.
In CI
diopter check --fail-on-template-calls.
In the UI
The Performance tab, from diopter next to your dev server, or the static report from diopter build.
For agents
MCP tool get-performance (diopter mcp).

Learn more