Expression được sử dụng để gắn kết các dữ liệu ứng dụng ra thẻ HTML. Expression được viết trong dấu {{ expression}}. Expression có cách hoạt động tương đối giống ng-bind directive. Các expression trong ứng dụng AngularJS là các JavaScript expression thuần túy và xuất kết quả là dữ liệu mà chúng ta sử dụng.
Sử dụng số trong Expression trong AngularJS:
<p>Giá sách : {{cost * quantity}}.000 VNĐ</p>
Sử dụng chuỗi trong Expression trong AngularJS:
<p>Xin chào {{student.firstname + " " + student.lastname}}!</p>
Sử dụng đối tượng trong Expression trong AngularJS:
<p>Mã số sinh viên: {{student.rollno}}</p>
Sử dụng mảng trong Expression trong AngularJS:
<p>Điểm thi (Môn Tin): {{marks[3]}}</p>
Ví dụ:
Dưới đây là ví dụ cho các expression mô tả bên trên:
viduExpression.html
<html>
<head>
<title>Ví dụ về Expressions trong AngularJS</title>
</head>
<body>
<h1>Ứng dụng QTM</h1>
<div ng-app = "" ng-init = "quantity = 1;cost = 30; student = {firstname:'Quan Tri',lastname:'Mang',rollno:101};marks = [80,90,75,73,60]">
<p>Xin chào {{student.firstname + " " + student.lastname}}!</p>
<p>Giá sách : {{cost * quantity}}.000 VNĐ</p>
<p>Mã số sinh viên: {{student.rollno}}</p>
<p>Điểm thi (Môn Tin): {{marks[3]}}</p>
</div>
<script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
</body>
</html>
Kết quả
Mở trang viduExpression.html trên trình duyệt web và xem kết quả dưới đây.
Theo Tutorialspoint
Bài trước: Các Directive trong AngularJS
Bài tiếp: Thành phần Controller trong AngularJS