נראה את מימוש Dependency Injection על הפרוייקט לדוגמא. בפונקציית ה-get ב-controller יש לנו coupling. קובץ ProductsController.cs יצירת ה-Interface כדי להשתמש ב-GetAllProducts צריך להכיר את ProductsRepository וזה כרגע מייצר את הבעיה. כדי לפתור את זה ניצור תיקייה שנקרא לה Contracts. בתוכה נוסיף item שהוא interface שנקרא לו IProductsRepository. בתוך IProductsRepository נשים את חתימת הפונקציה שאנחנו צריכים. […]
המשך של מבנה ה-Controller. ראינו שמבנה של controller בו אנחנו משתמשים ב-new על מנת ליצור class אחר, הוא משהו שעובד, אבל לא רצוי. אם כותבים new בקוד, כנראה שעושים משהו לא נכון! מותר לעשות new כאשר מדובר על new של ישויות מידע. לא לשירותים, כלומר classes שמחזיקים פונקציות. Product הוא ישות, אין בו פונקציונליות, יש […]
כשרצינו לפנות למודל קונפיגורציה פנינו דרך: וקראנו ערכים ב-middleware עם IOptions: מה קורה כשצריכים את הנתונים מהקונפיגורציה לא ב-middleware אלא במקום אחר, כמו בקונטרולר? לא נפנה דרך הפונקציה, אלא דרך ה-constructor. Constructor של Controller נייצר constructor ל-controller. קובץ ProductsController.cs מתי נוצר ה-controller? יש לנו בקובץ program את AddControllers ולמטה יותר יש את MapControllers. ה-MapControllers בונה […]
לפעמים יש לנו מצב של טופס שפרוס על פני כמה עמודים, צעדים של מילוי טופס. אנחנו רוצים את אותו הטופס לאורך כל התהליך. אפשר לעשות את זה עם form control. הגדרת הטופס הראשי בעמוד הראשי שמכיל את הניווט לשאר העמודים ואת ה-router-outlet נגדיר את הטופס. קובץ span-form.component.ts קובץ span-form.component.html התבנית של העמוד מחזיקה את כפתורי […]
חלק 1: Imperative Programming | חלק 2: Change Detection Strategy & Unsubscribing בחלקים הקודמים השתמשנו ב-Imperative Programming כדי למשוך את רשימת הפוסטים ואת רשימת הקטגוריות. נראה את אותה פונקציונליות עם Declarative Programming. כדי להשאיר את מה שכבר יש לנו ניצור קומפוננטה חדשה עבור הפוסטים וכן service חדש. ניצור נתיב חדש עבור הפוסטים שלנו. אותם פוסטים […]
פוסט המשך לפוסט: Imperative Programming. נדבר על Change Detection Strategy. מה זה ולמה אנחנו צריכים להשתמש בזה? נוסיף להגדרת הקומפוננטה את changeDetection. ChangeDetectionStrategy.OnPush קובץ posts.component.ts אחרי שמירה נראה שהמסך שלנו לא מציג שום נתונים. אם נסתכל על טאב ה-network בדפדפן נראה שיש קריאה ל-API, אבל אין מידע. השימוש ב-OnPush גורם לזה שאין רינדור של המידע. […]
Imperative Programming Imperative Programming הוא תכנות מסורתי בו אנחנו אומרים לתוכנית מה לעשות צעד אחרי צעד. תביא מידע מה-DB, אחר כך תעשה איקס וכו' Declarative Reactive Programming הוא תכנות בו אנחנו אומרים מה אנחנו רוצים לעשות, לא מה הצעדים. Declarative Programming משפר את הביצועים של התוכנית. למשל, בדרך כלל כדי לקבל מידע מה-DB נעשה subscribe […]
יצירת פרוייקט חדש ניצור פרוייקט חדש. נתקין את bootstrap כדי שיהיה קל יותר לעצב את הדפים. יצירת מודול לפוסטים וקומפוננטות מתאימות יצירת routes src/app/post/post-routing.module.ts יצירת מודל הפוסט כדי לקבל את המידע בצורה של פוסטים ניצור interface שיחזיק את המידע הזה. src/app/post/post.ts יצירת ה-service src/app/post/post.service.ts הוספת הלוגיקה והטמפלט של הקומפוננטה בקובץ הראשי נקבל את כל רשימת […]
כדי לעדכן מידע ב-DB אנחנו משתמשים בפונקציית put. נוסיף לטבלת הפוסטים שלנו כפתור ששולח לפעולת העדכון. פעולת עדכון תתבצע בדרך כלל מתוך טופס, הטופס שמשמש להכנסת תוכן חדש יכול לשמש גם לעדכון הפוסט. כל מה שצריך לעשות זה רק להוסיף לתוכן השדות את מה שכבר קיים באובייקט. השלבים יהיו: app.component.html בקומפוננטת העריכה נקרא לפונקציה שמגיבה […]
ביטול item אחד פונקציית delete תבטל מידע מתוך ה-DB. נוסיף בכל שורת מידע שיש לנו כפתור כדי לבטל את הפוסט. הכפתור הזה יוביל לפונקציית הביטול שמוגדרת בקומפוננטה. app.component.html נגדיר את פונקציית ה-delete ב-service. posts.service.ts בקובץ הקומפוננטה נקרא לפונקציית הביטול של ה-service מתוך פונקציית הלחיצה על הביטול בטבלה. app.component.ts ביטול כל ה-items אם אנחנו רוצים לבטל […]