Angular Demo
HTML Code
Output
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js"></script> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css"> <style> .ngif_demo { margin-top:30px; display:block; background: #4C9B79; height: auto; width:300px; border-radius: 10px; padding:10px; font-size:15px; color:#fff; } </style> </head> <body ng-app=""> Show/Hide HTML table: <input type="checkbox" ng-model="shtable" ng-init="shtable = true"> <table ng-if="shtable" class="table table-bordered table-striped"> <tr> <th>ID</th> <th>Name</th> <th>Quality</th> <th>Quantity</th> </tr> <tr> <td>1</td> <td>Wheat</td> <td>Good</td> <td>200 Bags</td> </tr> <tr> <td>2</td> <td>Rice</td> <td>Good</td> <td>250 Bags</td> <tr> <td>3</td> <td>Sugar</td> <td>Good</td> <td>200 Bags</td> </tr> </table> </body> </html>
Show/Hide HTML table:
ID
Name
Quality
Quantity
1
Wheat
Good
200 Bags
2
Rice
Good
250 Bags
3
Sugar
Good
200 Bags