# Signals must be invoked in template interpolations.

This diagnostic detects uninvoked signals in template interpolations.

```angular-ts
import {Component, signal, Signal} from '@angular/core';

@Component({
  template: `<div>{{ mySignal }}</div>`,
})
class MyComponent {
  mySignal: Signal<number> = signal(0);
}
```

## What's wrong with that?

Angular Signals are zero-argument functions (`() => T`). When executed, they return the current value of the signal.
This means they are meant to be invoked when used in template interpolations to render their value.

## What should I do instead?

Ensure to invoke the signal when you use it within a template interpolation to render its value.

```angular-ts
import {Component, signal, Signal} from '@angular/core';

@Component({
  template: `<div>{{ mySignal() }}</div>`,
})
class MyComponent {
  mySignal: Signal<number> = signal(0);
}
```

## Configuration requirements

[`strictTemplates`](tools/cli/template-typecheck#strict-mode) must be enabled for any extended diagnostic to emit.
`interpolatedSignalNotInvoked` has no additional requirements beyond `strictTemplates`.

## What if I can't avoid this?

This diagnostic can be disabled by editing the project's `tsconfig.json` file:

```json
{
  "angularCompilerOptions": {
    "extendedDiagnostics": {
      "checks": {
        "interpolatedSignalNotInvoked": "suppress"
      }
    }
  }
}
```

See [extended diagnostic configuration](extended-diagnostics#configuration) for more info.
