آانگولار جی ایس ایکسپریشن
- پچھلے پیج آانگولار جی ایس معرف
- آئندہ پیج آانگولار جی ایس ماڈیول
آنگولر جی ایس،عبارتدیکھیں HTML پر داده بند کریں。
آانگولار جی ایس ایکسپریشن
آنگولر جی ایس عبارت کو دو بڑی قوسوں میں لکھا جاسکتا ہے:{{ expression }}
。
آنگولر جی ایس عبارت کو امروں میں بھی لکھا جاسکتا ہے:ng-bind="expression"
。
آانگولار جی ایس ایکسپریشنآنگولر جی ایس عبارت کو پارسی کرکے عبارت لکھنے کی جگہ پر نتیجہ برآمد کرتا ہے。 جسمانی عبارت: وہ لفظی مقدار، آپریٹر اور متغیرات شامل کرسکتا ہے。
مثال {{ 5 + 5 }} یا {{ firstName + " " + lastName }}
مثال
<!DOCTYPE html> <html> <script src="https://cdn.staticfile.net/angular.js/1.6.9/angular.min.js"></script> <body> <div ng-app=""> <p>میری پہلی عبارت: {{ 5 + 5 }}</p> </div> </body> </html>
اگر نکال دیا گیا تو ng-app
امر، ایچ تی ایم ایل عبارت کو اصل شکل میں نمائش دے گا، اس کو پارسی نہیں کرے گا:
مثال
<!DOCTYPE html> <html> <script src="https://cdn.staticfile.net/angular.js/1.6.9/angular.min.js"></script> <body> <div> <p>میری پہلی عبارت: {{ 5 + 5 }}</p> </div> </body> </html>
آپ کسی بھی پسند کئے گئے مقام پر ایک عبارت لکھ سکتے ہیں، آنگولر جی ایس سادے طور پر عبارت کو پارسی کرکے نتیجہ برآمد کرتا ہے。
مثال: اجازه دهید AngularJS مقدار CSS property را تغییر دهد.]}
برای تغییر رنگ این فیلد ورودی، مقدار آن را تغییر دهید:
آبی روشنمثال
<div ng-app="" ng-init="myCol='lightblue'"> <input style="background-color:{{myCol}}" ng-model="myCol"> </div>
اعداد AngularJS
اعداد AngularJS مانند اعداد JavaScript هستند:
مثال
<div ng-app="" ng-init="quantity=1;cost=5"> <p>مجموع مبلغ (دلار): {{ quantity * cost }}</p> </div>
استفاده از ng-bind
مثال مشابه:
مثال
<div ng-app="" ng-init="quantity=1;cost=5"> <p>مجموع مبلغ (دلار): <span ng-bind="quantity * cost"></span></p> </div>
استفاده از ng-init معمولاً کم است. شما در فصل مربوط به کنترلرها روش بهتری برای initialize دادهها یاد خواهید گرفت.
رشتههای AngularJS
رشتههای AngularJS مانند رشتههای JavaScript هستند:
مثال
<div ng-app="" ng-init="firstName='Bill';lastName='Gates'"> <p>نام <span ng-bind="firstName + " " + lastName"></span> است</p> </div>
مثال استفاده از ng-bind:
مثال
<div ng-app="" ng-init="firstName='Bill';lastName='Gates'"> <p>نام <span ng-bind="firstName + ' ' + lastName"></span> است</p> </div>
مجموعههای AngularJS
مجموعههای AngularJS مانند اشیاء JavaScript هستند:
مثال
<div ng-app="" ng-init="person={firstName:'Bill',lastName:'Gates'}"> <p>نام <span ng-bind="person.lastName"></span> است</p> </div>
مثال استفاده از ng-bind:
مثال
<div ng-app="" ng-init="person={firstName:'Bill',lastName:'Gates'}"> <p>نام <span ng-bind="person.lastName"></span> است</p> </div>
مجموعههای AngularJS
مجموعههای AngularJS مانند مجموعههای JavaScript هستند:
مثال
<div ng-app="" ng-init="points=[1,15,19,2,40]"> <p>نتیجه سوم {{ points[2] }}</p> </div>
مثال استفاده از ng-bind:
مثال
<div ng-app="" ng-init="points=[1,15,19,2,40]"> <p>تیسرا نتیجہ یہ ہے <span ng-bind="points[2]"></span></p> </div>
آانگولار جی ایس ایکسپریشن اور جاوا اسکریپٹ ایکسپریشن
جاوا اسکریپٹ ایکسپریشن کی طرح، آانگولار جی ایس ایکسپریشن میں لفظی مقدار، آپریٹر اور متغیرات شامل کئے جاسکتے ہیں۔
جاوا اسکریپٹ ایکسپریشن سے فرق کے باوجود، آانگولار جی ایس ایکسپریشن میں ایچ تی ایمل کے اندر لکھا جاسکتا ہے۔
آانگولار جی ایس ایکسپریشن کو شرط جملات، حلچک وغیرہ نہیں کا دعوی کرسکتا، جبکہ جاوا اسکریپٹ ایکسپریشن اس کا دعوی کرسکتا ہے۔
آانگولار جی ایس ایکسپریشن فیلٹر کا تعاون کرتا ہے، جبکہ جاوا اسکریپٹ ایکسپریشن نہیں کرتا ہے۔
جس میں ہماری جاوا اسکریپٹ تعلیمات میں سے معلومات حاصل کرسکتے ہیں، جاوا اسکریپٹ کے بارے میں معلومات حاصل کریں۔
- پچھلے پیج آانگولار جی ایس معرف
- آئندہ پیج آانگولار جی ایس ماڈیول