AngularJS İfade

AngularJSİfadeVerileri HTML'e bağlar.

AngularJS İfade

AngularJS ifadeleri çift büyük parantez içinde yazılabilir:{{ expression }}.

AngularJS ifadeleri düzenleyiciler içinde de yazılabilir:ng-bind="expression".

AngularJS ifadeleri çözümleyecek ve ifadenin yazıldığı konumda sonuçları döndürecektir.

AngularJS İfadeçok benzer JavaScript ifadesi:Onlar kelime olarak, işleçler ve değişkenler içerebilir.

Örnek {{ 5 + 5 }} veya {{ firstName + " " + lastName }}

örnek

<!DOCTYPE html>
<html>
<script src="https://cdn.staticfile.net/angular.js/1.6.9/angular.min.js"></script>
<body>
<div ng-app="">
  <p>İlk ifadem: {{ 5 + 5 }}</p>
</div>
</body>
</html>

Kişisel olarak deneyin

Eğer kaldırdıysanız ng-app Düzenleyici, HTML ifadeleri tam olarak gösterir, çözümleme yapmaz:

örnek

<!DOCTYPE html>
<html>
<script src="https://cdn.staticfile.net/angular.js/1.6.9/angular.min.js"></script>
<body>
<div>
  <p>İlk ifadem: {{ 5 + 5 }}</p>
</div>
</body>
</html>

Kişisel olarak deneyin

Angaje ettiğiniz herhangi bir konumda ifade yazabilirsiniz, AngularJS basitçe ifadeyi çözümleyecek ve sonuçları döndürecektir.

Örnek: AngularJS'in CSS özelliklerinin değerini değiştirmesi.

Aşağıdaki giriş kutusunun rengini değiştirmek için değerini değiştirin:

açık mavi

örnek

<div ng-app="" ng-init="myCol='lightblue'">
<input style="background-color:{{myCol}}" ng-model="myCol">
</div>

Kişisel olarak deneyin

AngularJS sayıları

AngularJS sayıları JavaScript sayılarına benzer:

örnek

<div ng-app="" ng-init="quantity=1;cost=5">
<p>Toplam miktar (dolar): {{ quantity * cost }}</p>
</div>

Kişisel olarak deneyin

kullanarak ng-bind aynı örnek:

örnek

<div ng-app="" ng-init="quantity=1;cost=5">
<p>Toplam miktar (dolar): <span ng-bind="quantity * cost"></span></p>
</div>

Kişisel olarak deneyin

ng-init kullanımı nadir. Kontrolcülerle ilgili bölümlerde daha iyi veri initilizasyon yöntemlerini öğreneceksiniz.

AngularJS dizgileri

AngularJS dizgileri JavaScript dizgilerine benzer:

örnek

<div ng-app="" ng-init="firstName='Bill';lastName='Gates'">
<p>İsim {{ firstName + " " + lastName }}</p>
</div>

Kişisel olarak deneyin

ng-bind kullanımı ile aynı örnek:

örnek

<div ng-app="" ng-init="firstName='Bill';lastName='Gates'">
<p>İsim <span ng-bind="firstName + ' ' + lastName"></span></p>
</div>

Kişisel olarak deneyin

AngularJS nesneleri

AngularJS nesneleri JavaScript nesnelerine benzer:

örnek

<div ng-app="" ng-init="person={firstName:'Bill',lastName:'Gates'}">
<p>İsim {{ person.lastName }}</p>
</div>

Kişisel olarak deneyin

ng-bind kullanımı ile aynı örnek:

örnek

<div ng-app="" ng-init="person={firstName:'Bill',lastName:'Gates'}">
<p>İsim <span ng-bind="person.lastName"></span></p>
</div>

Kişisel olarak deneyin

AngularJS dizileri

AngularJS dizileri JavaScript dizilerine benzer:

örnek

<div ng-app="" ng-init="points=[1,15,19,2,40]">
<p>Üçüncü sonuç {{ points[2] }}</p>
</div>

Kişisel olarak deneyin

ng-bind kullanımı ile aynı örnek:

örnek

<div ng-app="" ng-init="points=[1,15,19,2,40]">
<p>Üçüncü sonuç <span ng-bind="points[2]"></span> dir</p>
</div>

Kişisel olarak deneyin

AngularJS ifadeleri ile JavaScript ifadeleri

JavaScript ifadesi gibi, AngularJS ifadeleri Literal, işlevsellik ve değişkenler içerebilir.

JavaScript ifadesinden farklı olarak, AngularJS ifadeleri HTML içine yazılabilir.

AngularJS ifadeleri şart ifadeleri, döngüler ve istisnaları desteklemezken, JavaScript ifadeleri destekler.

AngularJS ifadeleri filtreleri desteklerken, JavaScript ifadeleri desteklemez.

JavaScript hakkında bilgi edinmek için bizim JavaScript eğitimimize göz atın.