AngularJS ifodalari
AngularJS ma’lumotlarni HTML’ga ifodalar yordamida bog‘laydi.
AngularJS ifodalari
AngularJS ifodalari qo‘sh jingalak qavslar ichida yozilishi mumkin: {{ expression }}.
AngularJS ifodalarini direktiva ichida ham yozish mumkin: ng-bind="expression".
AngularJS ifodani hisoblaydi va natijani aynan ifoda yozilgan joyga qaytaradi.
AngularJS ifodalari JavaScript ifodalariga juda o‘xshaydi: ular literallar, operatorlar va o‘zgaruvchilarni o‘z ichiga olishi mumkin.
Masalan, {{ 5 + 5 }} yoki {{ firstName + " " + lastName }}
Misol
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>
<div ng-app="">
<p>My first expression: {{ 5 + 5 }}</p>
</div>
</body>
</html>
O‘zingiz sinab ko‘ring »
Agar ng-app direktivasini olib tashlasangiz, HTML ifodani hisoblamasdan, qanday bo‘lsa shundayligicha ko‘rsatadi:
Misol
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>
<div>
<p>My first expression: {{ 5 + 5 }}</p>
</div>
</body>
</html>
O‘zingiz sinab ko‘ring »
Ifodalarni istalgan joyga yozishingiz mumkin, AngularJS shunchaki ifodani hisoblaydi va natijani qaytaradi.
Misol: CSS xususiyatlarining qiymatini AngularJS o‘zgartirsin.
Quyidagi kiritish maydonining qiymatini o‘zgartirib, uning rangini o‘zgartiring:
Misol
<div ng-app="" ng-init="myCol='lightblue'">
<input style="background-color:{{myCol}}" ng-model="myCol">
</div>
O‘zingiz sinab ko‘ring »
AngularJS sonlari
AngularJS sonlari JavaScript sonlariga o‘xshaydi:
Misol
<div ng-app="" ng-init="quantity=1;cost=5">
<p>Total in dollar: {{ quantity * cost }}</p>
</div>
O‘zingiz sinab ko‘ring »
Xuddi shu misol ng-bind yordamida:
Misol
<div ng-app="" ng-init="quantity=1;cost=5">
<p>Total in dollar: <span ng-bind="quantity * cost"></span></p>
</div>
O‘zingiz sinab ko‘ring »
ng-init kamdan-kam ishlatiladi.
Ma’lumotlarni initsializatsiya qilishning yaxshiroq usulini kontrollerlar haqidagi bobda o‘rganasiz.
AngularJS stringlar
AngularJS stringlari JavaScript stringlariga o‘xshaydi:
Misol
<div ng-app="" ng-init="firstName='John';lastName='Doe'">
<p>The name is {{ firstName + " " + lastName }}</p>
</div>
O‘zingiz sinab ko‘ring »
Xuddi shu misol ng-bind yordamida:
Misol
<div ng-app="" ng-init="firstName='John';lastName='Doe'">
<p>The name is <span ng-bind="firstName + ' ' + lastName"></span></p>
</div>
O‘zingiz sinab ko‘ring »
AngularJS obyektlari
AngularJS obyektlari JavaScript obyektlariga o‘xshaydi:
Misol
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
<p>The name is {{ person.lastName }}</p>
</div>
O‘zingiz sinab ko‘ring »
Xuddi shu misol ng-bind yordamida:
Misol
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
<p>The name is <span ng-bind="person.lastName"></span></p>
</div>
O‘zingiz sinab ko‘ring »
AngularJS massivlari
AngularJS massivlari JavaScript massivlariga o‘xshaydi:
Misol
<div ng-app="" ng-init="points=[1,15,19,2,40]">
<p>The third result is {{ points[2] }}</p>
</div>
O‘zingiz sinab ko‘ring »
Xuddi shu misol ng-bind yordamida:
Misol
<div ng-app="" ng-init="points=[1,15,19,2,40]">
<p>The third result is <span ng-bind="points[2]"></span></p>
</div>
O‘zingiz sinab ko‘ring »
AngularJS ifodalari va JavaScript ifodalari
JavaScript ifodalari kabi, AngularJS ifodalari ham literallar, operatorlar va o‘zgaruvchilarni o‘z ichiga olishi mumkin.
JavaScript ifodalaridan farqli ravishda, AngularJS ifodalarini HTML ichida yozish mumkin.
AngularJS ifodalari shartlar, sikllar va istisnolarni (exception) qo‘llab-quvvatlamaydi, JavaScript ifodalari esa qo‘llab-quvvatlaydi.
AngularJS ifodalari filtrlarni qo‘llab-quvvatlaydi, JavaScript ifodalari esa qo‘llab-quvvatlamaydi.
JavaScript haqida JS darsligimizda o‘rganing.
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!