שלום לכולם,
השיעור למדנו על הנושא של Routing באנגולר.
ראינו מספר אפשרויות לנווט באפליקציה, בינהם :
- הגדרת ראוטר וניווט בסיסי באפליקציה – באמצעות קישורים ייעודיים למעבר בין קומפוננטות, דרך ה HTML
- שימוש ב Router דרך ה class וביצוע ניווט דינאמי באפליקציה, דבר המאפשר לנו להתנות את הניווט של המשתמש ולשנות אותו בצורה דינאמית.
- שימוש בפרמטרים שמועברים דרך ה URL – כמאצעי להעברת נתונים בין קומפוננטות / הפנית משתמש עם נתונים מסויימים.
תרגיל כיתה:
אני רוצה שתבנו אפליקציה עם ניווט בצורה הבאה:
במסך הראשון המשתמש מ
בתרגיל מוצגים 3 מסכים שונים, אחד עם פרטי הזמנה, אחד עם פרטי משלוח , ודף אחד בסיום לקבלת ההזמנה.
בראוטר שתגדירו יהיו 3 נתיבים עבור 3 קומפוננטות בהתאם לתמונה.
אחרי שהמשתמש ממלא את הטופס הראשון הוא יכול לעבור לשני, ואז מהשני הוא יכול לעבור לשלישי.
הנתונים נשמרים ב SessionStorage או ב LocalStorage לבחירתכם. ובסיום אתם שולפים אותם מה SessionStorage/LocalStorage .
במסך הראשון אני יוכל ללחוץ על הכפתור "הבא" רק אם מילאתי את כל השדות, אחרת הכפתור יהיה disable.
אם אני אנסה להכנס באופן ישיר לנתיב של המסך השני (על פי הראוטר) ולא נכנסתי למסך הראשון אני יועבר למסך הראשון. (תכתבו פונקציה שעובדת ב onInit ובודקת האם שמור למשתמש בסטורג' שם פרטי, טלפון ואימייל)
להגשה עד 20/3/20
בהצלחה