آموزش انگولار-عبارات
انگولار، با استفاده از عبارات(Expressions)، داده ها را به HTML پیوند می دهد.
عبارات انگولار-Angular Expressions
عبارات انگولار، بین دابل_آکولاد قرار می گیرند مانند: {{عبارت مورد نظر}}
عبارات انگولار، دقیقا مانند دستور ng-bind، داده ها را به HTML پیوند می دهند.
دقیقا در جایی که عبارت مورد نظر نوشته شده است، انگولار، داده ها را بعنوان خروجی نشان می دهد.
عبارات انگولار، بسیار شبیه به عبارات جاوا اسکریپت هستند: این عبارات می توانند شامل لیترال ها و اپراتورها و متغیرها باشند.
بعنوان مثال، {{5+5}} یا {{firstName + " " + lastName}} .
مثالی از انگولار
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<body>
<div ng-app="">
<p>My first expression: {{ 5 + 5 }}</p>
</div>
</body>
</html>
اگر که شما دستور ng-app را حذف کنید، عبارت مورد نظر، همان طور که هست نمایش می یابد و به اصطلاح حل نمی شود.
مثالی از انگولار
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<body>
<div>
<p>My first expression: {{ 5 + 5 }}</p>
</div>
</body>
</html>
اعداد در انگولار
اعداد در انگولار، شبیه اعداد جاوا اسکریپت هستند:
مثالی از انگولار
<p>Total in dollar: {{ quantity * cost }}</p>
</div>
مثالی مشابه با استفاده از ng-bind:
مثالی از انگولار
<p>Total in dollar: <span ng-bind="quantity * cost"></span></p>
</div>
 |
استفاده از ng-init خیلی متداول نیست. در آینده در قسمت مربوط به کنترلرها شما یک راه بهتر را برای مقداردهی اولیه به داده ها خواهید آموخت. |
|---|
رشته ها در انگولار
رشته های انگولار، مانند رشته های جاوا اسکریپت می باشند:
مثالی از انگولار
<p>The name is {{ firstName + " " + lastName }}</p>
</div>
مثلی مشابه مثال بالا با استفاده از ng-bind :
مثالی از انگولار
<p>The name is <span ng-bind="firstName + ' ' + lastName"></span></p>
</div>
اشیاء در انگولار
اشیاء انگولار مانند اشیاء در جاوااسکریپت می باشند:
مثالی از انگولار
<p>The name is {{ person.lastName }}</p>
</div>
مثالی مشابه با استفاده از ng-bind :
مثالی از انگولار
<p>The name is <span ng-bind="person.lastName"></span></p>
</div>
آرایه ها در انگولار
آرایه های انگولار، مانند آرایه های جاوااسکریپت هستند:
مثالی از انگولار
<p>The third result is {{ points[2] }}</p>
</div>
مثالی مشابه با استفاده از ng-bind:
مثالی از انگولار
<p>The third result is <span ng-bind="points[2]"></span></p>
</div>
عبارات انگولار یا عبارات جاوا اسکریپت
درست مانند عبارات جاوا اسکریپت، عبارات انگولار نیز می توانند شامل لیترال ها و اپراتورها و متغیرها باشند.
برخلاف عبارات جاوااسکریپت، عبارات انگولار می توانند درون تگ های HTML نوشته شوند.
عبارات انگولار، از شرطی ها و حلقه ها و استثناها پشتیبانی نمی کنند در حالی که عبارات جاوااسکریپت از موارد ذکر شده پشتیبانی می کنند.
عبارات انگولار از فیلترها(filters) پشتیبانی می کنند اما عبارات جاوااسکریپت چنین کاری را انجام نمی دهند.
- نوشته شده توسط احسان عباسی
- بازدید: 10371
دیدگاه‌ها
ممنون