Expression trong AngularJS

phan tu html dom trong angularjs 640 size 300x0 znd

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:

<piể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.

Kết quả sau khi chạy ứng dụng Angular

Leave a Reply

Your email address will not be published. Required fields are marked *