Les signals doivent être appelés dans les interpolations de template.

Ce diagnostic détecte les signals non appelés dans les interpolations de template.

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

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

Quel est le problème ?

Les signals Angular sont des fonctions sans argument (() => T). Lorsqu'ils sont exécutés, ils renvoient la valeur courante du signal. Ils doivent donc être appelés lorsqu'ils sont utilisés dans des interpolations de template pour afficher leur valeur.

Que faire à la place ?

Veillez à appeler le signal lorsque vous l'utilisez dans une interpolation de template pour afficher sa valeur.

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

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

Prérequis de configuration

strictTemplates doit être activé pour qu'un diagnostic étendu soit émis. interpolatedSignalNotInvoked n'a pas d'autre prérequis que strictTemplates.

Et si je ne peux pas l'éviter ?

Ce diagnostic peut être désactivé en modifiant le fichier tsconfig.json du projet :

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

Consultez la configuration des diagnostics étendus pour en savoir plus.