Observable (iz knjižnice RxJS) predstavlja tok vrednosti čez čas, na katerega se lahko naročite. Angular RxJS uporablja v celoti — HTTP zahtevki, dogodki usmerjenika, obrazci in EventEmitter so vsi osnovani na Observable-ih — zato je razumevanje le-teh bistveno.
Promise: a SINGLE future value, eager, can't cancel
Observable: ZERO-to-MANY values over time, lazy (runs on subscribe), CANCELLABLE
Observable-i lahko oddajajo več vrednosti, se izvršijo le ob naročilu in jih je mogoče odjaviti (preklicati) — kar jih naredi idealne za dogodke, tokove in HTTP, ki bi ga morda želeli preklicati.
import { HttpClient } from "@angular/common/http";
this.http.get<User[]>("/api/users").subscribe({
next: (users) => this.users = users, // each emitted value
error: (err) => console.error(err), // on error
complete: () => console.log("done"), // stream finished
});
Nič se ne zgodi, dokler ne .subscribe() — Observable je len.
import { map, filter, debounceTime } from "rxjs/operators";
this.searchInput.valueChanges.pipe(
debounceTime(300), // wait for typing to pause
filter(text => text.length > 2), // ignore short queries
map(text => text.trim()), // transform
).subscribe(query => this.search(query));
Operatorji (veriženi v .pipe()) deklarativno preobrazijo tok — debounce, filter, map itd. — elegantno rešavajo pogoste asinkrone težave (kot je iskanje med pisanjem).
import { Subscription } from "rxjs";
private sub = new Subscription();
ngOnInit() { this.sub = this.data$.subscribe(...); }
ngOnDestroy() { this.sub.unsubscribe(); } // ❗ prevent leaks
Ročne naročnine morajo biti počiščene v ngOnDestroy, sicer se izvajajo potem, ko je komponenta izginula — puščanje pomnilnika. Pogoste rešitve: async pipe (samodejno se odjavlja) ali takeUntilDestroyed().
<!-- ✅ the async pipe handles subscription AND cleanup for you -->
<li *ngFor="let user of users$ | async">{{ user.name }}</li>
RxJS Observable-i so prepleteni skozi Angular — brez njih ne morete uporabljati HttpClient-a, reaktivnih obrazcev ali usmerjenika.
Razumevanje naročanja, operatorjev in posebej odjave (ali uporaba async pipe za izogibanje ročnemu upravljanju) je kritično: gre tako za vir Angular-ove moči za asinkrone podatke kot tudi za eno njegovih najbolj pogostih pasti (puščanja iz pozabljenih naročnin).