באנגולר 2.0 יש כמה אסטרטגיות לזיהוי שינויים בנתונים, שבעקבות שינויים אלו צריך לעדכן את המסך.
ראו תמונה:
הסברים:
1. נתונים יכולים להשתנות בעקבות אחד משלושה מסוגי האירועים האסינכרוניים.
2. אנגולר 2.0 יודע לזהות את השינויים בשבילינו ע"י שימוש סטנדרטי ב-{{}}, attribues או directives קיימים.
בפוסט זה אני רוצה לדבר על האסטרטגיה שבה ה- component אחרי על זיהוי השינויים בעצמו. בשביל כך אנחנו צריכים לממש את הממשק DoCheck, שי לו מתודה אחת ngDoCheck. אנגולר 2.0 מפעיל את המתודה ngDoCheck לפני שהוא מעדכן את המסך. כלומר הפעלת המתודה ngDoCheck אומרת לנו שעכשיו אנחנו צריכים לזהות את השינויים בנתונים שיש ב- component ולפעול בהתאם.
דוגמא אמיתית ngFor:
ב- ngFor מזהים את השינויים ב- collection כאשר אנגולר מפעיל את ,ngDoCheck ע"פ שינויים אלו מוסיפים, מורידים או מעדכנים את UI. ראו קוד כאן.
אנגולר מספק לנו שתי מחלקות שעוזרות לנו לזהות שינויים בנתונים, KeyValueDiffers ו- IterableDiffers. המחלקה KeyValueDiffers עוזרת לזהות שינויים על אובייקט והמחלקה IterableDiffers עוזרת לזהות שינויים ב- collections.
שימו לב:
ü המחלקות מסוג Differs עובדות על סמך ערך ישן וערך נוכחי וההבדלים בניהם. מכאן שצריך לחבר אותם לנתונים ברגע שהם נשמרים על ה- component. ב-ngFor כאשר ה-set של ngForOf עובד אז הם מאתחלים את ה- iterableDiffers.
ü המחלקות מסוג Differs לא זורקות אירועים, הרעיון שרק שמופעל ה- ngDoCheck אנחנו רוצים לדעת על השינויים, כי זה הזמן שאנחנו יכולים לעדכן את ה-UI.
ü בדר"כ מי שמשתמש באסטרטגיה זו באחריותו לעדכן את המסך.
ü לא חייבים להשתמש במחלקות אלו, אפשר להשתמש גם במחלקות צד שלישי.
ü אם ממשים את ngDoCheck אז ngOnChanges לא יעבוד.
באנגולר 1 שאלת השאלות הייתה מה ההבדל בין compile ל- link ב- directives. באנגולר 2 אני מאמין שאלת השאלות תהיה מה הבדל בין ngDoCheck ל- ngOnChanges? אך זה שייך לפוסט אחר J
Eyal's space 
מיקי
פברואר 10, 2016 at 6:40 pm
הייתי ממליץ לך לבדוק קצת את Ember.JS
אני יודע שהיום Angular/React הם ״הדבר החם״, אבל Ember עברה לאחרונה שינוי מהותי ופישוט של תשתיות.
עם מנוע Rendering חדש (ששאב את הרעיון מ-React).
אז אחרי שאנגולר שברו הכל עם 2.0 וסיבכו הכל, ההמלצה שלי היא Ember.
שלומי.
אפריל 21, 2016 at 4:40 pm
מיקי, אנגולר לא שברו הכל… האמת שממש לא.
מי שיודע אנגולר וכתב קוד אנגולר נכון כתב גם קוד אנגולר 2.
ההבדל היחידי הוא שלא היה לו את כל האופציות שיש ב-2.
אני לא אומר את זה ממקום מגונן, זה פשוט כך.
קוד שכתוב ב TypeScript ומשתמש בWebPack פשוט מובל לשם… גם באנגולר 1.
מסכים שיש הרבה אפשרויות שנוספו לאנגולר 2 וזה מסבך את העניינים, אבל זה תקף רק אם החלטת להשתמש.
אפשר פשוט להתעלם ולהשתמש רק במה שנוח לך.
אגב אנגולר 2 כ״כ מודלרי שהכל שם יכול להתחלף.
אני מאמין שהשילוב הבא לבניית אפליקציות יהיה TypeScript ואנגולר 2
להם יתווספו NativeScript , Electron וכמובן web
זה מאפשר, כבר היום, לבנות אפליקציה עם בסיס משותף לא קטן לכל הפלטפורמות… דפדפן, osx, win, linux, android, ios והכל native אמיתי.
ועוד דבר לגבי אנגולר 2, הכוח האמיתי שלו ומה שנותן לו את כל היכולות זה Zones וזה באמת מה שמשנה את המשחק ומאפשר את כל הביצועים והטרוף הזה… זה משהו שעדיין לא התפוצץ אבל זה כל הכוח מאחורי אנגולר 2.