שיעור 3 ב- ionic – המונח Page ואיך עובד הניווט ?

נדבר הפעם על 2 נושאים :

המונח Page ב-ionic – הוא :

  • מבחינת מעשית מדובר ב-component רגיל של אנגולר.
  • מבחינת קונספט, הוא משמש כמסך אחד – שהוא מה שמוצג על המסך.
  • אפשר כמובן לכלול בתוכו קומפונטות אחרות של אנגולר.

איך עובד הניווט ב- ionic ?

  • ב-ionic 2 ואילך, לא עושים שימוש ב-angular router
  • במקום זאת, משתמשים במערכת ניווט שמאפשרת לנווט בין מערך של Pages.
  • זאת הסיבה שמוגדר ב-ionic שהיא חייבת להתחיל עם rootApp משלה – רואים את זה בקובץ app.module.ts, בחלק של bootstrap.
  • בנוסף רואים זאת בקובץ app.html.
  • אנחנו יכולים להוסיף למערך של ה-Pages כל פעם דף חדש.
  • העיקרון הוא שאנחנו רואים על המסך רק את ה-Page האחרון שהכנסנו למערך. (הכנסנו – פעולת push ) .
  • מה שאומר…שאם נסיר את ה-Page האחרון שהכנסנו, אנחנו נראה בחזרה את ה-Page שקדם לו במערך. ( הסרה – פעולת pop ).
  • העיקרון הזה מאוד חשוב להבנה – הניווט של ionic הוא ניווט בין דפים (pages).
    וכדי לנווט אנחנו מכניסים ומוציאים דפים מתוך מערך.

התגית של סרגל הניווט

בקובץ app.html מופיעה השורה הבאה :

<ion-nav [root]="rootPage"></ion-nav>

התגית ion-nav היא זו שיוצרת את סרגל הניווט, כאשר המאפיין root הוא זה שקובע מהו העמוד הראשון שרואים – בדוגמא הנוכחית , זה העמוד rootPage.

איפה רואים מה המשמעות של rootPage ? 

תשובה :  אם נסתכל בקובץ app.component.ts נראה שם את המשתנה שנקרא rootPage

 rootPage:any = TabsPage;

כעת אנחנו מבינים כיצד ionic "יודעת" איזה דף הוא הדף הראשי, ומהיכן מוגדר סרגל הניווט.

 

 

תגובה אחת בנושא “שיעור 3 ב- ionic – המונח Page ואיך עובד הניווט ?

כתיבת תגובה

האימייל לא יוצג באתר. שדות החובה מסומנים *