TRANG CHỦ HTML AngularJS
AngularJS có các chỉ thị để liên kết dữ liệu ứng dụng với các thuộc tính của phần tử DOM HTML.
Chỉ thị ng-vô hiệu hóa
Chỉ thị ng-disable liên kết dữ liệu ứng dụng AngularJS với thuộc tính bị vô hiệu hóa của các phần tử HTML.
Ví dụ về AngularJS
<div ng-app="" ng-init="mySwitch=true">
<p>
<button ng-disabled="mySwitch">Click Me!</button>
</p>
<p>
<input type="checkbox" ng-model="mySwitch">Button
</p>
<p>
{{ mySwitch }}
</p>
</div>
Ứng dụng được giải thích:
Lệnh ng-disable liên kết mySwitch dữ liệu ứng dụng với thuộc tính bị vô hiệu hóa của nút HTML .
Chỉ thị ng-model liên kết giá trị của phần tử hộp kiểm HTML với giá trị của mySwitch .
Nếu giá trị của mySwitch được đánh giá là true , nút sẽ bị vô hiệu hóa:
<p>
<button disabled>Click Me!</button>
</p>
Nếu giá trị của mySwitch được đánh giá là false , nút sẽ không bị vô hiệu hóa:
<p>
<button>Click Me!</button>
</p>
Chỉ thị ng-show
Lệnh ng-show hiển thị hoặc ẩn một phần tử HTML.
Ví dụ về AngularJS
<div ng-app="">
<p ng-show="true">I am visible.</p>
<p ng-show="false">I am not visible.</p>
</div>
Lệnh ng-show hiển thị (hoặc ẩn) một phần tử HTML dựa trên giá trị của ng-show.
Bạn có thể sử dụng bất kỳ biểu thức nào đánh giá là true hoặc false:
Ví dụ về AngularJS
<div ng-app="" ng-init="hour=13">
<p ng-show="hour > 12">I am visible.</p>
</div>
Trong chương tiếp theo, có nhiều ví dụ hơn, sử dụng cách nhấp vào nút để ẩn các phần tử HTML.
Chỉ thị ng-hide
Lệnh ng-hide ẩn hoặc hiển thị một phần tử HTML.
Ví dụ về AngularJS
<div ng-app="">
<p ng-hide="true">I am
not visible.</p>
<p ng-hide="false">I am visible.</p>
</div>