التعبيرات عبارة عن مقتطفات رمز تشبه JavaScript ، وعادة ما يتم وضعها في المنطقة المرتبطة (مثل {{{Expression}}). يتم تحليل التعبيرات وتنفيذها من خلال خدمة $ parse (http://code.angularjs.org/1.0.2/docs/api/ng.$parse).
على سبيل المثال ، ما يلي تعبيرات صالحة في الزاوي:
1. التعبير الزاوي مقابل تعبير JS
من السهل على الأشخاص أن يربطوا تعبير طريقة العرض الزاوية كتعبير عن جافا سكريبت ، ولكن هذا غير صحيح تمامًا ، لأن Angular لا يقيم التعبير من خلال eval () من JavaScript. يمكنك التفكير في التعبير الزاوي كتعبير جافا سكريبت مع الاختلافات التالية:
من ناحية أخرى ، إذا أردنا تنفيذ رمز JavaScript التعسفي (في تعبير زاوي) ، يمكننا كتابة هذا الرمز في إحدى طرق وحدة التحكم والاتصال به. إذا أردنا تقييم () تعبير زاوي في JavaScript ، فيمكننا استخدام طريقة $ eval ().
<! doctype html> <html lang = "zh-cn" ng-app = "expressionTest"> <head> <meta charset = "utf-8"> <title> expression-e1 </title> <style type = "text/css"> .ng-cloak {display: none ؛ } </style> </head> <body ng-controller = "myctrl"> 1 + 2 = {1 + 2}} <br/> التعبير: <input type = "text" ng-click = "removeExp ($ index)" href = ""> x </a>] <tt> {{expr}} </tt> => <span ng-bind = "$ parent. $ eval (expr)> </span> </li> </ul> <swrcrip type = "text/javaScript"> </script> <script type = "text/javaScript"> var app = Angular.Module ("ExpressionTest" ، []) ؛ App.Controller ("myctrl" ، الدالة (scope $) {var exprs = $ scope.exprs = [] }) ؛ </script> </body> </html>2. تقييم الممتلكات
يعد سياق بيئة تحليل التعبير الزاوي نطاقًا ، في حين أن JavaScript هو نافذة (يجب أن تشير إلى الوضع الصارم EVEL) ، والاحتياجات الزاوية للوصول إلى كائن النافذة العالمي من خلال نافذة $. على سبيل المثال ، إذا كنا بحاجة إلى استدعاء ALERT () المحددة على كائن نافذة في تعبير ، فنحن بحاجة إلى استخدام $ window.alert (). يهدف هذا إلى تجنب الوصول عن طريق الخطأ إلى الحالة العالمية (مصدر شائع للحشرات الدقيقة).
<! doctype html> <html lang = "zh-cn" ng-app = "propertyValuation"> <head> <meta charset = "utf-8"> <title> propertyValuation </title> <style type = "text/css"> .ng-cloak {display: none ؛ } </style> </head> <body> <div ng-controller = "myctrl"> الاسم: <input ng-model = "name" type = "text"/> <button ng click = "greet () type = "text/javaScript"> var app = Angular.Module ("propertyValuation" ، []) ؛ app.controller ("myctrl" ، function ($ scope ، $ window) {$ scope.name = "kitty" ؛ $ scope.greet = function () {$ window.alert ("hello" + $ scope.name) ؛} ؛3. التسامح (التسامح ، التسامح مع الخطأ؟)
تقييم التعبير هو مسامحة غير محددة وغير فارغة. في JavaScript ، عندما لا يكون A كائنًا ، تقييم ABC ، سيتم طرح استثناء. في بعض الأحيان يكون هذا معقولًا لللغات الشائعة ، ويستخدم تقييم التعبير بشكل أساسي لربط البيانات ، والنموذج العام هو كما يلي:
{{abc}}
إذا لم يكن موجودًا ، فلا يبدو أن أي عرض أكثر منطقية من إلقاء استثناء (ما لم ننتظر أن يستجيب الخادم ، والذي سيتم تعريفه في فترة قصيرة). إذا لم يكن التعبير متسامحًا بدرجة كافية عند التقييم ، فإننا نكتب رمز الربط بشكل مربك:
{{((a || {}). b || {}). c}} // هذا ...
وبالمثل ، عند الإشارة إلى دالة ABC () ، إذا كانت غير محددة أو فارغة ، فما عليك سوى إرجاع غير محدد.
4. لا توجد بيانات تدفق التحكم
لا يمكننا كتابة بيانات التحكم في العملية في التعبيرات. والسبب وراء ذلك هو أن النظام الأساسي للزاوي هو أن منطق التطبيق يجب أن يكون في وحدة التحكم (النطاق) ، وليس في العرض. إذا احتجنا إلى إضافة فروع مشروطة أو حلقات أو استثناءات في التعبير عن العرض ، فيمكننا تفويض طريقة JavaScript بدلاً من ذلك (يمكنك استدعاء الطريقة في النطاق).
5. المرشحات
عندما نقدم البيانات للمستخدمين ، قد نحتاج إلى تحويل البيانات من التنسيق الأصلي إلى تنسيق ودود (قابل للقراءة للغاية). على سبيل المثال ، لدينا كائن بيانات يجب تنسيقه بناءً على المنطقة قبل عرضه على المستخدم. يمكننا نقل التعبيرات إلى سلسلة من المرشحات ، مثل:
الاسم | كبار
يمكن لمقيم التعبير هذا ببساطة تمرير قيمة الاسم إلى مرشح الأحرف الكبيرة.
تستخدم مرشحات السلسلة هذا بناء الجملة:
القيمة | Filter1 | Filter2
يمكننا أيضًا نقل المعلمات مقسومة على الكولون إلى مرشحات ، على سبيل المثال ، عرض 123 في مكانين عشريين:
123 | الرقم: 2
6. بادئة "$"
قد نجدها غريبًا ، ما معنى البادئة "$"؟ إنها بادئة بسيطة (منع النزاعات) التي يستخدمها الزاوي للتمييز بين اسم واجهة برمجة التطبيقات الخاصة به عن واجهات برمجة التطبيقات الأخرى. إذا لم يستخدم Angular $ ، فسيعود تقييم A.Length () غير محدد. لأن لا ولا زاوي يحدد هذه الخاصية.
بالنظر إلى أن الإصدارات المستقبلية من Angular قد تختار زيادة الطول ، فإن هذا سيغير سلوك هذا التعبير. ما هو أسوأ من ذلك هو أننا قد نخلق مطورين خاصية طول ستتعارض بعد ذلك مع Angular. هذه المشكلة موجودة لأن Angular يمتد الكائن الموجود حاليًا عن طريق إضافة طرق. من خلال إضافة البادئة "$" ، يحتفظ Angular بمساحة محددة ، بحيث يمكن للمطورين والمطورين الزاويين الذين يستخدمون Angular العيش في وئام.