Tutorial Pengantar AngularJS: Ekspresi AngularJS

Ekspresi digunakan untuk mengikat data aplikasi ke HTML. Ekspresi ditulis dalam kurung ganda seperti {{ekspresi}}. Perilaku dalam ekspresi sama dengan arahan NG-bind. Ekspresi aplikasi AngularJS adalah ekspresi javascript murni dan output data yang mereka gunakan di sana.

Format ekspresi AngularJS: {{ekspresi}}

Ekspresi AngularJS dapat berupa string, angka, operator, dan variabel

Operasi nomor {{1 + 5}}

String concatenation {{'abc' + 'bcd'}}

Variabel Operation {{firstName + "" + lastName}}, {{kuantitas * biaya}}

Objek {{person.LastName}}

Array {{point [2]}}

Contoh AngularJS

1. Pos

 <Div ng-app = "" ng-init = "kuantitas = 2; biaya = 5"> <p> Harga Total: {{kuantitas * biaya}} </p> </div>

Contoh output di atas:

Harga Total: 10

KOMENTAR KODE:

ng-init = "kuantitas = 2; biaya = 5" // setara dengan var kuantitas = 2, biaya = 5 dalam javascript;

Fungsi yang sama dapat dicapai dengan menggunakan NG-Bind

 <Div ng-app = "" ng-init = "kuantitas = 1; biaya = 5"> <p> Harga total: <span ng-bind = "kuantitas * biaya"> </span> </p> // ng-bind di sini setara dengan bagian dalam dari rentang yang ditentukan </div>

2. String AngularJS

 <div ng-app = "" ng-init = "firstName = 'John'; lastName = 'snow'"> <p> Nama: {{firstName + "" + lastName}} </p> </div>

Keluaran

Nama: Jone Snow

3. Objek AngularJS

 <Div ng-app = "" ng-init = "person = {firstName: 'John', lastName: 'snow'}"> <p> Nama belakang adalah {{person.LastName}} </p> </div>

Keluaran

Salju

4. Array AngularJS

 <Div ng-app = "" ng-init = "point = [1,15,19,2,40]"> <p> Nilai ketiga adalah {{points [2]}} </p> </div>

Keluaran

Nilai ketiga adalah 19

Di atas adalah pengantar ekspresi AngularJS dari tutorial pengantar AngularJS yang diperkenalkan kepada Anda oleh editor. Saya harap ini akan membantu Anda!