एक Observable (RxJS लाइब्रेरीबाट) समयको साथ मानहरूको एक प्रवाह प्रतिनिधित्व गर्छ जसमा तपाई सदस्यता लिन सक्नुहुन्छ। Angular ले RxJS को व्यापक प्रयोग गर्छ — HTTP अनुरोध, राउटर ईभेन्ट, फार्म, र EventEmitter सबै Observable-आधारित छन् — त्यसैले तिनलाई बुझ्नु आवश्यक छ।
Promise: a SINGLE future value, eager, can't cancel
Observable: ZERO-to-MANY values over time, lazy (runs on subscribe), CANCELLABLE
Observable ले एकाधिक मानहरू उत्सर्जन गर्न सक्छ, केवल सदस्यता लिँदा निष्पादन हुन्छ, र सदस्यता रद्द गर्न सकिन्छ (रद्द गर्न सकिन्छ) — जसले तिनलाई घटनाहरू, प्रवाहहरू, र HTTP को लागि आदर्श बनाउँछ जुन तपाई रद्द गर्न सक्नुहुन्छ।
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
});
कुनै पनि कुरा तब सम्म हुँदैन जब तपाई .subscribe() गर्नुहुन्छ — Observable आलसी छ।
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));
अपरेटरहरू (.pipe() भित्र जोडिएको) घोषणात्मकताबाट प्रवाहलाई रूपान्तरण गर्छन् — debounce, filter, map, आदि — सामान्य async समस्याहरू समाधान गर्छन् (जस्तै search-as-you-type) सुन्दरताबाट।
import { Subscription } from "rxjs";
private sub = new Subscription();
ngOnInit() { this.sub = this.data$.subscribe(...); }
ngOnDestroy() { this.sub.unsubscribe(); } // ❗ prevent leaks
म्यानुअल सदस्यताहरू ngOnDestroy मा सफा गरिनुपर्छ, अन्यथा तिनीहरू कम्पोनेन्ट जाँदा पनि चलिरहन्छन् — एक स्मृति लीक। सामान्य समाधानहरू: async pipe (स्वचालित-unsubscribes), वा takeUntilDestroyed()।
<!-- ✅ the async pipe handles subscription AND cleanup for you -->
<li *ngFor="let user of users$ | async">{{ user.name }}</li>
RxJS Observable Angular भित्र बुनिएका छन् — तपाई HttpClient, reactive forms, वा router बिना प्रयोग गर्न सक्नुहुन्छ।
सदस्यता, अपरेटरहरू, र विशेष गरी unsubscribing (वा async pipe प्रयोग गरी म्यानुअल व्यवस्थापन टाल्न) बुझ्नु महत्त्वपूर्ण छ: यो Angular को async डेटाको लागि शक्तिको स्रोत र यसका सबैभन्दा सामान्य समस्याहरू (भुल्ने सदस्यताहरूबाट लीक) दुवै हो।