لغو اشتراک
لغو اشتراک برای اشتراک RxJS برای لغو اشتراک.
در Angular، ما معمولا از اشتراک RxJS استفاده می‌کنیم، اما گاهی فراموش می‌کنیم که اشتراک آن را لغو کنیم، که باعث نشت حافظه می‌شود. مزایای استفاده از Unsubscriber این است که نیازی به مدیریت متغیرهای فردی و لغو اشتراک آنها نیست (البته خوب کار می کند، اما برای نوشتن به کد کمی بیشتر نیاز دارد). Unsubscriber یک کلاس ساده برای جذب اشتراک های RxJS در یک آرایه است.
زنگ زدن unsubscribe() برای لغو اشتراک همه آنها، همانطور که انجام می دهید
در کتابخانه اجزای شما unmount/onDestroy رویداد چرخه زندگی
نصب و راه اندازی
npm install unsubscriber --save
نمونه های زاویه ای
2 راه اصلی برای استفاده از Unsubscriber وجود دارد: راه “تنظیم کننده” و راه “افزودن/آرایه”.
RxJS از افزودن اشتراک به آرایه ای از اشتراک ها پشتیبانی می کند. سپس می توانید مستقیماً از آن آرایه لغو اشتراک کنید. اگر این تکنیک را با Unsubscriber با استفاده از نحو تنظیم کننده زیر ترجیح می دهید، از آن استفاده کنید.
تنظیم کننده تکنیک – نحو
مثال با استفاده از queue دارایی برای جمع آوری اشتراک ها با استفاده از یک تنظیم کننده.
export class ExampleComponent implements OnDestroy {
private bus = new Unsubscriber();
...
this.bus.queue = observable$.subscribe(...);
this.bus.queue = observable$.subscribe(...);
this.bus.queue = observable$.subscribe(...);
...
// Unsubscribe all subscription when the component dies/destroyed
ngOnDestroy() {
this.bus.unsubscribe();
}
}
تکنیک آرایه/افزودن – نحو
مثال با استفاده از .add تکنیک. این مشابه چیزی است که RxJS خارج از جعبه پشتیبانی می کند.
export class ExampleComponent implements OnDestroy {
private bus = new Unsubscriber();
...
this.bus.add(observable$.subscribe(...));
this.bus.add(observable$.subscribe(...));
// Add multiple subscriptions at the same time
this.bus.add(
observable1$.subscribe(...),
observable2$.subscribe(...),
anotherObservable$.subscribe(...)
);
...
// Unsubscribe all subscription when the component dies/destroyed
ngOnDestroy() {
this.bus.unsubscribe();
}
}
Github Techindeck
