ניצור קומפוננטת חיפוש ללא כפתור. הקומפוננטה מציגה תיבת טקסט שבה מכניסים את ערך החיפוש. search.component.html קודם נציג ל-console את הערך של החיפוש שמקבלים מתיבת הטקסט. search.component.ts עם הקוד הזה אנחנו מחפשים כל פעם כשנכנסת אות, אנחנו רוצים לחפש רק כשיש צורך, כלומר שמפסיקה ההקלדה. נגדיר subject שיזרוק לנו את האירוע של ההקלדה. search.component.ts נשתמש ב-filter […]

אם אנחנו רוצים להשתמש ב-service בכמה קומפוננטות, במקום להחזיק את הערך בנפרד בכל קומפוננטה, אחננו יכולים רק להסתכל על הערך שמוחזק לנו ב-service. המשתנה counter$ הוא Observable. count.service.ts הוא לא משתנה אמיתי, אלא רק stream של מידע, לכן מסמנים אותו עם $. app.component.ts בדף נשתמש ב-pipe async כדי להציג את הערך. app.component.html ה-pipe עושה לנו […]

דוגמא לקשר בין קומפוננטות על ידי services. נקרא לקומפוננטה all-users כדי להציג את רשימת המשתמשים. app.component.html את הקומפוננטה של המשתמשים נחבר ל-service של users. all-users.component.ts בדף נציג את רשימת המשתמשים. יש עמודה של שם, של תפקיד וכפתור שמציג בצד את הפרטים של המשתמש. לחיצה על הכפתור תפנה לקומפוננטה user-detail לבצגת הפרטים. לחיצה על הכפתור קוראת […]

אובייקט Subscription יכול לאסוף הרבה נרשמים וליצור בעיה של זיכרון. אפשר לקחת את הנרשמים ולהסיר את ההרשמה שלהם. counter.component.ts עכשיו, כשהקומפוננטה מסיימת את החיים שלה, גם ההרשמה מסתיימת.

אם אנחנו רוצים לשתף מידע בין קומפוננטות שונות, אנחנו יכולים להשתמש בפונקציות של ה-service. בתצוגה יש לנו מונה פשוט עם כפתורי +-. counter.component.html ב-class אנחנו יוצרים מונה עם ערך ראשוני של 0 וקוראים לפונקציות של פלוס ומינוס. הפונקציות האלה קוראות לפונקציות המתאימות ב-service. counter.component.ts הפונקציות של ה-service משנות את הערך של המונה הגלובלי. counter.service.ts שימוש […]

יצירת service השירות הזה אחראי על אספקת הנתונים. employee.service.ts ב-class שאנחנו רוצים להשתמש בו נכין משתנה שיקלוט את הנתונים. במקרה הזה, זאת הקומפוננטה של רשימת העובדים. employee-list.component.ts נוכל ליצור גם בקומפוננטה אחרת את המשתנה שיקלוט את רשימת העובדים. employee-detail.component.ts אנחנו צריכים לרשום את השירות אחרת הוא ישמש כפונקציה רגילה. הכי טוב לעשות את זה ב-app.module […]

למה משמש service באנגולר Service הוא class רב פעמי ואפשר להשתמש בפונקציות או במשתנים שלו במספר קומפוננטות. אם יש לנו מידע שאנחנו צריכים בכמה קומפוננטות, נוכל להשתמש ב-service על מנת לקבל את המידע ולספק אותו לקומפוננטות הרצויות. נסתכל על מבנה הקבצים הבא: אנחנו קוראים לקומפוננטה של רשימת העובדים. app.html ב-class יש לנו את רשימת העובדים […]