Lệnh ng-switch của AngularJS
Định nghĩa và cách sử dụng
ng-switch
Lệnh cho phép bạn ẩn/hiển thị phần HTML dựa trên biểu thức.
Nếu phần con thông qua ng-switch-when
Khi lệnh nhận được phần khớp, nó sẽ hiển thị phần có ng-switch-when
thành phần con của lệnh, nếu không sẽ xóa bỏ phần đó và các phần con của nó.
Bạn cũng có thể sử dụng ng-switch-default
Lệnh định nghĩa phần mặc định để hiển thị phần đó khi các phần khác đều không khớp.
Mô hình
Chỉ khi nó khớp với một giá trị cụ thể, một phần HTML nào đó mới được hiển thị:
<div ng-switch="myVar"> <div ng-switch-when="dogs"> <h1>Chó</h1> <p>Chào mừng bạn đến với thế giới của chó.</p> </div> <div ng-switch-when="tuts"> <h1>Hướng dẫn</h1> <p>Học từ các ví dụ.</p> </div> <div ng-switch-when="cars"> <h1>Xe ô tô</h1> <p>Đọc về xe ô tô.</p> </div> <div ng-switch-default> <h1>Chuyển đổi</h1> <p>Chọn chủ đề từ danh sách rơi để chuyển nội dung của DIV này.</p> </div> </div>
Cú pháp
<element ng-switch="expression"> <element ng-switch-when="value"></element> <element ng-switch-when="value"></element> <element ng-switch-when="value"></element> <element ng-switch-default></element> </element>
Tất cả các phần tử HTML đều hỗ trợ.
Tham số
Tham số | Mô tả |
---|---|
expression | Biểu thức, sẽ xóa bỏ các phần tử không có khớp và hiển thị các phần tử có khớp. |