Rumah >hujung hadapan web >tutorial js >Ungkapan nota kajian asas AngularJS_AngularJS
AngularJS mengikat data ke HTML melalui ungkapan.
Ekspresi AngularJS
Ungkapan AngularJS ditulis dalam kurungan berganda: {{ pernyataan ungkapan }}.
Ungkapan AngularJS mengikat data ke HTML dengan cara yang sama seperti arahan ng-bind.
AngularJS akan "mengeluarkan" ungkapan dengan tepat sebagai hasil yang dikira.
Ungkapan AngularJS mempunyai banyak persamaan dengan ungkapan JavaScript Kedua-duanya mengandungi literal, operator dan pembolehubah. Contohnya {{ 5 5 }} dan {{ firstName " " lastName }}
<!DOCTYPE html> <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>
Jika anda mengalih keluar arahan ng-app, ungkapan akan dipaparkan terus pada halaman tanpa dinilai.
<!DOCTYPE html> <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>
Nombor AngularJS
Nombor AngularJS adalah sama dengan nombor JavaScript:
<div ng-app="" ng-init="quantity=1;cost=5"> <p>Total in dollar: {{ quantity * cost }}</p> </div>
Begitu juga, kita boleh menggunakan arahan ng-bind untuk mencapai kesan yang sama:
<div ng-app="" ng-init="quantity=1;cost=5"> <p>Total in dollar: <span ng-bind="quantity * cost"></span></p> </div>
Nota Menggunakan arahan ng-init adalah sangat biasa dalam pembangunan AngularJS. Dalam bahagian Pengawal anda akan melihat cara yang lebih baik untuk memulakan data.
AngularJS String
Rentetan AngularJS adalah sama dengan rentetan JavaScript:
<div ng-app="" ng-init="firstName='John';lastName='Doe'"> <p>The name is {{ firstName + " " + lastName }}</p> </div>
Begitu juga, kita boleh menggunakan arahan ng-bind untuk mencapai kesan yang sama:
<div ng-app="" ng-init="firstName='John';lastName='Doe'"> <p>The name is <span ng-bind="firstName + ' ' + lastName"></span></p> </div>
Objek AngularJS
Objek AngularJS adalah sama dengan objek JavaScript:
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}"> <p>The name is {{ person.lastName }}</p> </div>
Begitu juga, kita boleh menggunakan arahan ng-bind untuk mencapai kesan yang sama:
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}"> <p>The name is <span ng-bind="person.lastName"></span></p> </div>
AngularJS Array
Tatasusunan AngularJS adalah sama seperti tatasusunan JavaScript:
<div ng-app="" ng-init="points=[1,15,19,2,40]"> <p>The third result is {{ points[2] }}</p> </div>
Begitu juga, kita boleh menggunakan arahan ng-bind untuk mencapai kesan yang sama:
<div ng-app="" ng-init="points=[1,15,19,2,40]"> <p>The third result is <span ng-bind="points[2]"></span></p> </div>
Perbandingan ungkapan AngularJS dan ungkapan JavaScript
Seperti ungkapan JavaScript, ungkapan AngularJS juga mengandungi literal, operator dan pembolehubah. Tidak seperti ungkapan JavaScript,
Ekspresi AngularJS boleh ditulis dalam HTML.
Ungkapan AngularJS tidak menyokong pernyataan bersyarat dan gelung, dan tidak ada pernyataan pengecualian.
Ekspresi AngularJS menyokong penapis.
Di atas adalah keseluruhan kandungan artikel ini, saya harap anda semua menyukainya.