يستمر النص الأصلي ، ويستمر الكتاب في الاستمرار. . . لا تزال تشير إلى http://code.angularjs.org/1.0.2/docs/guide/compiler
1. ملخص
يسمح برنامج التحويل البرمجي HTML الخاص بـ Angular للمطورين بتخصيص بناء جملة HTML جديد. يتيح لنا برنامج التحويل البرمجي إرفاق السلوك بأي عنصر أو سمة HTML ، أو حتى علامات HTML جديدة ، سمات (مثل <beautiful girl = "cf"> </beyants>). الزاوي يدعو هذه التوجيهات السلوكيات الإضافية.
يحتوي HTML على العديد من هياكل نمط HTML المحددة مسبقًا التي تقوم على وجه التحديد بتنسيق مستندات ثابتة (والتي يمكن أن تخبر المتصفح كيفية عرض المحتوى الموسومة). لنفترض أن شيئًا ما يجب أن يركز ، ولا نحتاج إلى تعليم المتصفح كيفية القيام بذلك (تم حذف الكلمات هنا). نحتاج فقط إلى إضافة align = "المركز" إلى العلامات التي تحتاج إلى توسيطها. هذا هو الشيء العظيم في اللغة التعريفية.
لكن اللغات التصريحية لها حدودها أيضًا ، أي أنه لا يمكنك إخبار المتصفح بكيفية التعامل مع بناء الجملة خارج النطاق المحدد مسبقًا. على سبيل المثال ، لا يمكننا إخبار المتصفح بكل بساطة كيفية محاذاة النص 1/3 من المتصفح. لذلك ، نحن بحاجة إلى وسيلة للحفاظ على المتصفح يتحرك مع العصر وتعلم قواعد جديدة.
الزاوي قبل النطاقات بعض التوجيهات التي هي مفيدة في بناء التطبيقات. يمكننا أيضًا إنشاء توجيهات فريدة لتطبيقاتنا الخاصة. ستصبح ملحقات التوجيه هذه "لغة محددة المجال" لتطبيقاتنا الخاصة.
لن تحدث هذه المجموعات إلا على جانب المتصفح ولا تتطلب خطوات الخادم أو خطوات premompilation.
2. مترجم
كخدمة زاوية ، يكون المترجم مسؤولاً عن عبور بنية DOM وإيجاد الخصائص. تنقسم عملية التجميع إلى مرحلتين:
1. ترجمة: اجتياز شجرة عقدة DOM وجمع جميع التوجيهات. والنتيجة هي وظيفة الارتباط.
2. الرابط: ربط التوجيهات في نطاق وإنشاء عرض مباشر. سوف تنعكس أي تغييرات في النطاق في العرض (تحديث العرض) ؛ سوف ينعكس أي نشاط (تغيير) لأي مستخدم إلى القالب في نموذج النطاق (الربط ثنائي الاتجاه). هذا يسمح لنموذج النطاق لتعكس القيمة الصحيحة.
بعض التوجيهات ، مثل NG-Repeat ، نسخ عنصرًا محددًا (مجموعة) مرة واحدة لكل عنصر في المجموعة. التجميع والربط هما مرحلتان لتحسين الأداء. نظرًا لأن القالب المستنسخ يحتاج فقط إلى تجميعه مرة واحدة ، ثم ربط العناصر في كل مجموعة مرة واحدة (على غرار ذاكرة التخزين المؤقت للقالب).
3. التوجيه
التوجيه هو سلوك يتم تشغيله عند مواجهة بنية HTML محددة أثناء التجميع. يمكن وضع التوجيهات في الاسم ، السمة ، الفصل ، وحتى تعليقات العناصر. فيما يلي بعض الطرق للإشارة إلى NG-Bind (توجيه مدمج):
<span ng-bind = "exp"> </span> <span> </span> <ng-bind> </grown-bind> <!-التوجيه: ng-bind exp->
التوجيه هو مجرد وظيفة تنفذ عندما يواجهها المترجم في DOM. توضح وثائق API التوجيهية بالتفصيل كيفية إنشاء توجيه.
فيما يلي عينة تسمح لعنصر للعب إخفاء وسعي مع الماوس ...
<! doctype html> <html lang = "zh-cn" ng-app = "hideankseek"> <head> <meta charset = "utf-8"> <title> hidden and seake </title> <style type = "text/css"> .ng-cloak {display: none ؛ } </style> </head> <body> <span wildcat> لقد هربت بمجرد لمسها ~~ تعال لي ~~ </span> <script src = "../ angular 1.0.1.js" type = "text/javaScript"> </script> <script type = "text/javascript"> angular.module ("hideanke" (وثيقة $) {var maxleft = 400 ، maxtop = 300 ؛ "الموضع": "absolute" ، "الحدود": "1PX Solid Green"}) ؛ })إن إضافة سمة "wildcat" إلى أي عنصر سيجعل العنصر له سلوك جديد. وبهذه الطريقة ، علمنا المتصفح كيفية التعامل مع العناصر التي ستختبئ وتسعى (لا تقلق ، فأنت لست في غرفة معينة ، ولن تعلق -_-!). لقد وسعنا "المفردات" للمتصفح من خلال هذا النهج. هذه طريقة طبيعية نسبيًا لأي شخص على دراية بقواعد HTML.
إنه في وقت متأخر من الليل الآن ، وسنستمر غدًا. . . نراكم بعد الإعلان
========================= GOODOUS DIVIDING LINE =====================================
4. فهم العرض (عرض)
هناك العديد من أنظمة القالب في الخارج ، والتي عادةً ما تتصل بالبيانات من خلال سلاسل القالب ، وتنشئ سلسلة HTML النهائية ، وتكتب النتيجة إلى عنصر من خلال سمة InnerHTML.
هذا يعني أنه عندما يتغير أي بيانات ، يجب دمج البيانات والقوالب في سلاسل مرة أخرى ، ثم يتم كتابة العنصر المقابل كـ innerhtml. هناك بعض المشكلات هنا: (لا أستطيع حقًا أن أفهم الترجمة الحرفية هنا ... فقط YY) لنفترض أن هناك مثل هذا المشهد ، ويحتوي القالب على مربع الإدخال. يدخل المستخدم مربع الإدخال ويتم تحديث القالب بشكل متزامن. تحديث القوالب العادية طرق العرض من خلال innerhtml والسلاسل واتصالات البيانات ، والتي ستقطع إدخال المستخدم ولديها تجربة سيئة.
Angular فريد من نوعه. يقوم برنامج التحويل البرمجي الزاوي (برنامج التحويل البرمجي) بمعالجة DOM من خلال التوجيهات ، وليس عن طريق معالجة قوالب سلسلة. نتيجة المعالجة هي وظيفة ربط تجمع بين نموذج النطاق وتولد قالبًا في الوقت الفعلي. ربط العرض بنموذج النطاق شفاف بالنسبة لنا. لا يحتاج المطورون إلى القيام بأي إجراءات لتحديث المشاهدات أو النماذج. علاوة على ذلك ، نظرًا لأن قالب العرض لا يتم تحديثه باستخدام InnerHTML ، فلن يتم مقاطعة إدخال المستخدم. بالإضافة إلى ذلك ، لا يمكن للتوجيهات الزاوية ربط قيم النص فحسب ، بل يمكن أيضًا أن تكون بنيات سلوكية.
طريقة المعالجة هذه من Angular تنتج DOM مستقرة. هذا يعني أنه خلال دورة حياة عنصر DOM ، يرتبط دائمًا بمثال لنموذج معين ، ولن تتغير هذه العلاقة. هذا يعني أيضًا أن الكود يمكن أن يحتفظ بالإشارة إلى كائن DOM ، وتسجيل وظائف الأحداث عليه ، وأنه لن يتم تدمير هذا المرجع عن طريق دمج بيانات القالب.