+ @if (user$ | async; as user) {
+
{{ user.name }}
+ } @else {
+
+ }
+
+```
+
+### ❌ Don't Do This
+Concrete examples of what to avoid
+
+```typescript
+// Anti-patterns: decorators for IO, HostBinding/HostListener, mutate(), star control flow, ngClass/ngStyle
+import { Component, ChangeDetectionStrategy, Input, Output, EventEmitter, HostBinding, HostListener, signal } from '@angular/core';
+
+@Component({
+ selector: 'app-bad',
+ standalone: true, // ❌ don't set; it's default
+ changeDetection: ChangeDetectionStrategy.Default, // ❌ should be OnPush
+ template: `
+ 0" [ngClass]="{ 'is-large': large }" [ngStyle]="{ color: color }">
+ {{ label }}: {{ count() }}
+
+ `
+})
+export class BadComponent {
+ @Input() label!: string; // ❌ use input()
+ @Output() changed = new EventEmitter