AngularJS İfadeleri
AngularJS, Expressions kullanarak verileri HTML'ye bağlar .
AngularJS İfadeleri
AngularJS ifadeleri çift parantez içinde yazılabilir: .{{ expression }}
AngularJS ifadeleri ayrıca bir direktifin içine de yazılabilir: .ng-bind="expression"
AngularJS ifadeyi çözecek ve sonucu tam olarak ifadenin yazıldığı yere döndürecektir.
AngularJS ifadeleri JavaScript ifadelerine çok benzer : Değişmezler, operatörler ve değişkenler içerebilirler.
Örnek {{ 5 + 5 }} veya {{ ad + " " + soyadı }}
Örnek
<!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>
Yönergeyi kaldırırsanız ng-app, HTML, ifadeyi çözmeden olduğu gibi görüntüler:
Örnek
<!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>
İfadeleri istediğiniz yere yazabilirsiniz, AngularJS basitçe ifadeyi çözecek ve sonucu döndürecektir.
Örnek: AngularJS'nin CSS özelliklerinin değerini değiştirmesine izin verin.
Değerini değiştirerek aşağıdaki giriş kutusunun rengini değiştirin:
Örnek
<div ng-app="" ng-init="myCol='lightblue'">
<input
style="background-color:{{myCol}}" ng-model="myCol">
</div>
AngularJS Numaraları
AngularJS numaraları JavaScript numaraları gibidir:
Örnek
<div ng-app="" ng-init="quantity=1;cost=5">
<p>Total in dollar: {{ quantity * cost }}</p>
</div>
Kullanarak aynı örnek ng-bind:
Örnek
<div ng-app="" ng-init="quantity=1;cost=5">
<p>Total in dollar: <span ng-bind="quantity * cost"></span></p>
</div>
Kullanımı ng-initçok yaygın değildir. Denetleyicilerle ilgili bölümde verileri başlatmanın daha iyi bir yolunu öğreneceksiniz.
AngularJS Dizeleri
AngularJS dizeleri JavaScript dizeleri gibidir:
Örnek
<div ng-app="" ng-init="firstName='John';lastName='Doe'">
<p>The name is {{ firstName + " " + lastName }}</p>
</div>
Kullanarak aynı örnek ng-bind:
Örnek
<div ng-app="" ng-init="firstName='John';lastName='Doe'">
<p>The name is <span ng-bind="firstName + ' ' + lastName"></span></p>
</div>
AngularJS Nesneleri
AngularJS nesneleri JavaScript nesneleri gibidir:
Örnek
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
<p>The name is {{ person.lastName }}</p>
</div>
Kullanarak aynı örnek ng-bind:
Örnek
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
<p>The name is <span ng-bind="person.lastName"></span></p>
</div>
AngularJS Dizileri
AngularJS dizileri JavaScript dizileri gibidir:
Örnek
<div ng-app="" ng-init="points=[1,15,19,2,40]">
<p>The third result is {{ points[2] }}</p>
</div>
Kullanarak aynı örnek ng-bind:
Örnek
<div ng-app="" ng-init="points=[1,15,19,2,40]">
<p>The third result is <span ng-bind="points[2]"></span></p>
</div>
AngularJS İfadeleri ve JavaScript İfadeleri
JavaScript ifadeleri gibi, AngularJS ifadeleri de değişmez değerler, operatörler ve değişkenler içerebilir.
JavaScript ifadelerinin aksine, AngularJS ifadeleri HTML içinde yazılabilir.
AngularJS ifadeleri koşulları, döngüleri ve istisnaları desteklemezken JavaScript ifadeleri destekler.
AngularJS ifadeleri filtreleri desteklerken JavaScript ifadeleri desteklemez.
JavaScript Eğitimimizde JavaScript hakkında bilgi edinin .