একটি 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
Observables একাধিক মান নির্গত করতে পারে, শুধুমাত্র সাবস্ক্রাইব করার সময় সম্পাদিত হয় এবং আনসাবস্ক্রাইব করা যায় (বাতিল করা) — যা ইভেন্ট, স্ট্রিম এবং 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 অলস (lazy)।
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 (স্বয়ংক্রিয় আনসাবস্ক্রাইব), অথবা takeUntilDestroyed()।
<!-- ✅ the async pipe handles subscription AND cleanup for you -->
<li *ngFor="let user of users$ | async">{{ user.name }}</li>
RxJS Observables Angular জুড়ে বোনা আছে — আপনি HttpClient, প্রতিক্রিয়াশীল ফর্ম বা রাউটার ছাড়া ব্যবহার করতে পারবেন না।
সাবস্ক্রিপশন, অপারেটর এবং বিশেষত আনসাবস্ক্রাইব করা বোঝা (বা ম্যানুয়াল ব্যবস্থাপনা এড়াতে async pipe ব্যবহার করা) সমালোচনামূলক: এটি async ডেটার জন্য Angular এর শক্তির উৎস এবং একই সাথে এর সবচেয়ে সাধারণ ফাঁদগুলির একটি (ভুলে যাওয়া সাবস্ক্রিপশন থেকে লিক)।