angularJS-tutorial/lab8.html at master · eramitmishra/angularJS-tutorial · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<!-- AngularJS - HTML DOM -->
<!--
Sr.No.  	Name	        Description
1   	    ng-disabled	    disables a given control.
2   	    ng-show	        shows a given control.
3   	    ng-hide	        hides a given control.
4   	    ng-click	    represents a AngularJS click event.
-->

<!DOCTYPE html>
<html>
<head >
    <title> AngularJS : HTML DOM </title>
	<meta charset="utf-8" />
    <script src="Scripts/angular.js"></script>
</head>
<body ng-app>


    <table>
        <tr>
            <td><input type="checkbox" ng-model="ens" name="name" /> <b>Click For Disable</b></td>
            <td><button ng-disabled="ens">Click Me!</button></td>
            <td>using ng-disabled Directive {disables a given control.}</td>
        </tr>
        <tr>
            <td><input type="checkbox" ng-model="ensh" name="name" /> <b>Click For Disable</b></td>
            <td><button ng-show="ensh">Click Me!</button></td>
            <td>using ng-show Directive {shows a given control.}</td>
        </tr>
        <tr>
            <td><input type="checkbox" ng-model="enshs" name="name" /> <b>Click For Disable</b></td>
            <td><button ng-hide="enshs">Click Me!</button></td>
            <td>using ng-hide Directive {hides a given control..}</td>
        </tr>
        <tr>
            <td><p>Total click: {{ clickCounter }}</p></td>
            <td><button ng-click="clickCounter = clickCounter + 1">Click Me!</button></td>
            <td>using ng-click Directive {represents a AngularJS click event.}</td>
        </tr>
    </table>


</body>
</html>