signal-use-as-signal-template
Verlangt () beim Zugriff auf Angular-Signals in Templates
- ⭐️ Diese Regel ist in der Flat Config
rdlabo.configs.recommendedenthalten.
Angular-Signals sind Funktionen. In einem Template muss ein Signal mit () aufgerufen werden, um seinen aktuellen Wert zu lesen. Das Vergessen der Klammern ist ein häufiger Fehler bei der Migration von RxJS-BehaviorSubject oder von model()-Inputs. Diese Regel erkennt Signal-Bezeichner in Angular-Templates und meldet direkte Lesezugriffe wie {{ count }} oder [hidden]="count".
Einzelheiten der Regel
Die Regel parst das Angular-Template jeder @Component. Sie sammelt Signal-Bezeichner aus:
- Klassenproperties, die durch einen Aufruf mit dem Funktionsnamen
signal,model,computed,linkedSignal,inputodertoSignalinitialisiert werden. - Verschachtelten Signal-Properties in Objektliteralen, beispielsweise
count = { first: signal(0) }.
Die Erkennung ist namensbasiert und löst die Herkunft von Imports nicht auf. Alias-Imports von Factory-Funktionen werden nicht erkannt; eine unbeteiligte lokale Funktion mit einem dieser Namen kann dagegen als Signal-Factory behandelt werden. toSignal wird üblicherweise aus @angular/core/rxjs-interop importiert. Die Regel erkennt es anhand des Namens, nicht des Moduls.
Anschließend meldet sie jede Stelle im Template, an der das Signal ohne () gelesen wird. Dazu gehören:
- Interpolation
{{ count }} - Property-Bindings
[hidden]="count" - Ereignisbindungen
(click)="count > 0 ? ..." - Kontrollflussausdrücke
@if (count),@switch (count),@for (...; track count) - Optional Chaining
count?.signal - Pipe-Verwendung
count | async
Die Regel unterstützt Komponenten mit template und templateUrl.
Beispiele
Inkorrekt
<div>{{ count }}</div>
<child [hidden]="count > 0"></child>
@if (count) {
<div>Positive</div>
}
<ion-input [formField]="count.first"></ion-input>
Korrekt
<div>{{ count() }}</div>
<child [hidden]="count() > 0"></child>
@if (count()) {
<div>Positive</div>
}
<ion-input [formField]="count.first()"></ion-input>
Eine Signal-Referenz an ein Kind übergeben
Wenn eine Kindkomponente ein Signal-Objekt statt seines Werts erwartet, können Sie die Referenz ohne () übergeben:
<child [inventorySignal]="inventorySignal"></child>
Die Regel erkennt diesen Fall und meldet ein als gebundenes Attribut übergebenes Signal ohne Aufruf nicht.
Optionen
Diese Regel besitzt keine Optionen.
Wann die Regel aktiviert werden sollte
Aktivieren Sie diese Regel in jedem Angular-Projekt mit Signals. Sie ist besonders nützlich bei der Migration von Observable-basiertem Code oder bei der Einführung von model() und input(), da diese APIs Signal-artige Objekte zurückgeben, die im Template aufgerufen werden müssen.