RSS

קטגוריה: Uncategorized

Angular Injector Round III

בפוסט זה אני מראה איך אפשר לוותר היום על ה- Injector !!! לא נפלתי על הראש (מקווה). בזמן האחרון אני כותב אנגולר 1.x ו-2.0 עם ES 6 או TS, והתחושה שה- Injector פשוט מיותר לגמרי באנגולר 1.0 עם כותבים ב- ES 6.

המטרות של ה- Injector באנגולר 1:

1. הזרקת השירותים שאני רוצה בלי להכיר את המימוש וע"י כך מקל אלי בבדיקות.

2. ה- Injector עובד כ- lazy initialization, עד שלא מבקשים שירות הוא לא נוצר. ראו סרט בנושא.

 

איך מפסיקים להשתמש ב-Injector של אנגולר?

1. בונים תחליף שמשמש כגשר בין השרותים של אנגולר לשרותים שלנו להלן יקרה ngServices.

2. ngServices צריך לתת לי גישה לכל השרותים של אנגולר שהם singleton, שזה כולם חוץ מ- $scope ו- $element. ( אם שכחתי, אנא תעירו לי ).

 // ngServices.js
export var ngServices = {
    $injector : null
};

export function addAngularServices() {
    for(let i = 0; i < arguments.length ; i++){
        let serviceName = arguments[i];
        Object.defineProperty(ngServices,serviceName,{
            get(){
                return ngServices.$injector.get(serviceName);
            }
        });
    }
}

export function ngServicesConfig($injectorProvider){
ngServices.$injector = $injectorProvider.$get();
}

 

 

כאשר אני רוצה לרשום שרות אני משתמש  בפונקציה addAngularServices. השרותים שאני נותן לפונקציה זו חייבים להיות רשומים גם באנגולר.

כאשר רוצים לצרוך שרות עושים import ל- ngServices. ראו דוגמא של שרות userProxy שצורך שרותי אנגולר בסיסיים כמו $http.

Capture

הסברים:

שאתם רוצים לכתוב שרות או סתם מחלקה אתם לא צריכים לרשום אותה יותר לאנגולר. אם אתם רוצים להשתמש בשרותים שרשומים באנגולר אתם צורכים אותם דרך ngServices.

כדי ש- ngServices יוכל לצרוך שרותים של אנגולר ולחשוף אותם דרכו את צריכים להוסיף את השורה הבאה למודול הראשי שלכם.

 

import angular from 'angular';
import {ngServicesConfig} from './utils/ngServices'
;

angular.module('app',[])
.config(ngServicesConfig);

 

סיכום:

אני מאמין שברגע שמשתמשים ב-import (systemjs) אין צורך לרשום את השרותים שלנו לתוך המודלים של אנגולר 1. הראתי שזה לא פוגע בשום יכולת קיימית אלה רק מקל אלינו את הפיתוח ומוריד את התלות באנגולר אחד. אני מאמין שזה יקל אלינו גם בשידרוג לאנגולר 2.

 

יש אפשרות לבצע את אותו טריק גם באנגולר 2, אך זה כבר פוסט אחר.

 

צריך לזכור שזה קוד ראשוני ועוד לא עבר את כל הבדיקות לכן אשמח לקבל הערות.

מודעות פרסומת
 
2 תגובות

פורסם ע"י ב- מרץ 31, 2016 ב- Uncategorized

 

Async and Parallel in JavaScript (meetup)

תודה לכל האנשים שבאו.  מצ"ב הלינק למצגת.

 
השארת תגובה

פורסם ע"י ב- ינואר 13, 2016 ב- Uncategorized

 

The Power Of ngModelController

בפוסט זה אני רוצה להציג תרגיל קטן שמדגים את היכולות של ngModel ובעיקר את היכולות של ה- controller שלו, ngModelController.

מטרת התרגיל:

1. להדגים את היכולות של $formatters ו- $parsers, ע"י שינוי מבנה הנתונים שעוברים בין ה-DOM והמודל.

2. להדגים את היכולות של $render, ע"י חיבור דו כיווני שלא באמצעות input תג.

הסברים: ( code )

1. אני בונה directive בשם box שהוא סוג חדש של data-binding.

2. אני משתמש ביכולות של ngModelController ולכן אני צריך לכתוב require : ngModel. קונטרולר זה מוזרק לי כארגומנט רביעי בפונקצית ה-link.

3. אני משתמש ב-  $formatters ו- $parsers כדי לעביר ממבנה נתונים אחד (מודל) למבנה נתונים שני ה- UI.

4. אני משתמש ב- $render כדי להסביר ל-ngModelController איך הוא מעדכן את ה-DOM, זה לא input תג.

5. אני משתמש ב- Drag & Drop כדי לעדכן את המיקום של ה-div.

6. יתרון בעבודה עם ngModelController שהוא מביא איתו עוד הרבה יכולות נוספות כמו בדיקות תקינות ומכונת מצבים של תקין כן/לא, עבר שינוי כן/לא, הודעות שגיאה ועוד.

למידה נוסף ראו את המצגת  או הפוסט.

 
השארת תגובה

פורסם ע"י ב- נובמבר 18, 2015 ב- Uncategorized

 
תמונה

Angular in Jerusalem

Angular Course in Jerusalem

עדכונים:

1. הקורס בירושלים בתאריכים 23,29,30 לדצמבר ו-5 לינואר מלא.

2. נפתח מחזור נוסף בירושלים בתאריכים 25,27 לינואר ו-1,3 לפברואר.

לרישום וקבלת פרטים לחצו כאן.

=====================================================

 

בעקבות בקשות רבות לבצע קורס בירושלים, אני שמח להודיע שהקורס ng-course

יהיה בתאריכים 23,29,30 לדצמבר. ו-5 לינואר.

לרישום לקבלת פרטים נוספים לחצו כאן.

לקהל הצפוני, אני מתכנן בתחילת שנת 2016 לעשות קורס בחיפה.

 
השארת תגובה

פורסם ע"י ב- אוקטובר 19, 2015 ב- Uncategorized

 

תגים: , ,

Modules & Injector in AngularJS

.
זה הסרט הראשון, אשמח לקבל תגובות.

 
תגובה אחת

פורסם ע"י ב- יולי 4, 2015 ב- Uncategorized

 

הטובים לאנגולר

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

 

20150521_092514

המנכ"ל יאיר כהן מציג את החברה שלו Simple Vision לתלמידים.

20150604_114753

הבעלים קורן טקו מציג את החברה שלו Clickdimensions לתלמידים.

20150604_091112
מנהל הפיתוח מיקי ליאור מציג את החברה STMS לתלמידים.

כל החברות שבאו לראיין את התלמידים היו מאוד מרוצות. המפגש הבא ב2.7

לפרטים נוספים שלחו לי מייל.

 

 
השארת תגובה

פורסם ע"י ב- יוני 22, 2015 ב- Uncategorized

 

AngularJS Course in May 2015

בעקבות הביקוש הרב לקורסים ציבורים נוספים בזמן הקרוב, החלטתי לפתוח את הקורסים הבאים:

     1.          Advanced JavaScript בתאריך 25/5/2015
קורס בן יום אחד שבו נלמד איך עובדת שפת ה-
JavaSscript. הקורס מתמקד בנושאים כמו זיכרון, ירושה, פיתוח אסינכרוני, ביצועים והיכולות החדשות של JavaScript 6
.

Module 1: Scope and Memory§  clip_image002

§  Module 2 : Object-Oriented Programming

§  Module 3:  Async & Parallel Programming in JavaScript

§  Module 4 : What’s new in ECMAScript 6

     2.          AngularJS A to Z בתאריך 1-2/6/2015
קורס בן יומיים שבו נלמד ליישם בפועל פיתוח אפליקציות WEB באמצעות AngularJS
, הקורס הינו מעשי כולל כתיבת קוד ומתקיים בכיתת מחשבים.

§  clip_image004Module 1: What are Web Applications?

§  Module 2: AngularJS Building Blocks for Building SPA

§  Module 3: Forms in AngularJS

§  Module 4: AngularJS Filters

§  Module 5: Communication

§  Module 6: Routing and Navigation

§  Module 7: AngularJS Services

§  Module 8: Directive

§  Module 9: Animation

§  Module 10: AngularJS Testing

     3.          AngularJS Internal בתאריך 8/6/2015
קורס בן יום בו נפרק את AngularJS לגורמים הבונים את ה- Framework ונלמד איך עובד AngularJS , מה נקודות החולשה שלו ואיך אפשר לשפר אותו.  הקורס מיועד לאנשים שמכירים AngularJS ועובדים איתו ביום יום, אך לא מכירים איך הוא עובד "מתחת למכסה המנוע". אני מבטיח לכם שתגלו הרבה דברים חדשים.
הקורס העמוק ביותר שתמצאו על אנגולר לאנשים שכבר עובדים עם הטכנולוגיה.

§  Module 1: AngularJS Bootstrap Process

§  Module 2: Modules

§  Module 3: $injector service

§  Module 4: Scope API’s

§  Module 3: Directive Internal

§  Module 4: Performance

 

לאתר הקורס לחצו כאן.

 
השארת תגובה

פורסם ע"י ב- אפריל 19, 2015 ב- Uncategorized