اینگولار جی ایس ایکسپریشن
- پائیدھ پر نکل اینگولار جی ایس معرفی
- پائیدھ پر نکل اینگولار جی ایس ماڈول
ਐਂਗੁਲਾਰ ਜੀਐਕਸਪ੍ਰੈਸ਼ਨਹੈਲਾਈਨ ਵਿੱਚ ਸੂਚਨਾ ਬਾਂਧ ਸਕਦਾ ਹੈ。
اینگولار جی ایس ایکسپریشن
ਐਂਗੁਲਾਰ ਜੀ ਐਕਸਪ੍ਰੈਸ਼ਨ ਨੂੰ ਦੁਗਣੇ ਬੜੇ ਬੱਕਟਾਕਸ ਅੰਦਰ ਲਿਖਿਆ ਜਾ ਸਕਦਾ ਹੈ:{{ 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
ਨਿਰਦੇਸ਼, HTML ਪ੍ਰਾਣਤਾ ਨਾਲ ਐਕਸਪ੍ਰੈਸ਼ਨ ਨੂੰ ਦਿਸਾਵੇਗਾ, ਪਰ ਇਸ ਨੂੰ ਪਾਰਸਿੰਗ ਨਹੀਂ ਕਰੇਗਾ:
مثال
<!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>
ਤੁਸੀਂ ਪਸੰਦ ਕਰਨ ਵਾਲੇ ਕਿਸੇ ਸਥਾਨ 'ਤੇ ਐਕਸਪ੍ਰੈਸ਼ਨ ਲਿਖ ਸਕਦੇ ਹੋ, ਐਂਗੁਲਾਰ ਜੀ ਸਰਲ ਤਰੀਕੇ ਨਾਲ ਐਕਸਪ੍ਰੈਸ਼ਨ ਨੂੰ ਪਾਰਸਿੰਗ ਕਰੇਗਾ ਅਤੇ ਨਤੀਜਾ ਵਾਪਸ ਦੇਵੇਗਾ。
مثال: تغییر مقدار CSS property توسط AngularJS.
برای تغییر رنگ ورودی زیر، مقدار آن را تغییر دهید:
آبی روشنمثال
<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>
اینگولار جی ایس ایکسپریشن جی ایس ایکسپریشن
جی ایس ایکسپریشن جی ایس ایکسپریشن سے مشابهت کا رکھتا ہے، انگولار جی ایس ایکسپریشن میں لفظی مقدار، آپریٹر اور متغیرات شامل کئے جاسکتے ہیں۔
جی ایس ایکسپریشن سے متفاوت، انگولار جی ایس ایکسپریشن میں ایچ تی ایمل کے اندر لکھی جاسکتی ہیں۔
اینگولار جی ایس ایکسپریشن کوئی شرط جملات، چکر اور استثنائی نہیں کرتی ہیں، جبکہ جی ایس ایکسپریشن یہ سب سپورٹ کرتی ہیں۔
اینگولار جی ایس ایکسپریشن فیلٹر کا سپورٹ کرتی ہیں، جبکہ جی ایس ایکسپریشن نہیں کرتی ہیں۔
آپ کا جی ایس درس میں جی ایس کا معلومات جائیں
- پائیدھ پر نکل اینگولار جی ایس معرفی
- پائیدھ پر نکل اینگولار جی ایس ماڈول