אופרטורים ב-Rxjs הם פונקציות שמקבלות Observable כקלט, מבצעות עליו פעולות ומחזירות Observable חדש. אנחנו משתמשים באופרטורים כדי לשנות את המידע שמגיע אלינו דרך ה-Observable.
נבנה Observable מתוך ערכים של מערך.
array1 = [2, 4, 6, 8, 10];
myObservable4 = from(this.array1);
Map operator
אנחנו רוצים לקחת את הערכים שה-Observable הזה מטריג ולעשות בהם שינוי. נפעיל על ה-Observable את האופרטור map. האופרטור map הוא פונקציה.
map מקבל כארגומנט פונקציית callback. הפונקציה מחזירה את המידע מעובד לפי מה שכתבנו בפונקציה.
array1 = [2, 4, 6, 8, 10];
myObservable4 = from(this.array1);
multiplyObs = this.myObservable4.pipe(map((value) => {
return value*2
}));
ngOnInit(){
this.multiplyObs.subscribe({
next: result => {
console.log(result);
},
error: error => {
console.log(error.message);
},
complete: () => {
console.log("Observable4 completed!");
}
});
}
בקוד פה, כל ערך נלקח, מוכפל פי 2 ומוחזר. הערכים של multiplyObs יהיו כפולים משל myObservable4.
Filter operator
נראה את האופרטור filter. האופרטור מקבל ערך ומחזיר אותו רק אם הוא עונה על תנאי מסויים.
array1 = [2, 4, 6, 8, 10];
myObservable4 = from(this.array1);
filteredObs = this.myObservable4.pipe(filter((value) => {
return value >= 6
}));
שירשור אופרטורים
אפשר לשרשר אופרטורים אחד אחרי השני.
array1 = [2, 4, 6, 8, 10];
myObservable4 = from(this.array1);
TransformedObs = this.myObservable4.pipe(map((value) => {
return value * 2;
}),
filter((value) => {
return value >= 6;
}));