Ng-Click-1

We can display or hide the div element on the basis of value of isShow variable.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Welcome to LearnKode - A code learning platform</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
</head>
<body ng-app="">
    <form name="form">
        <div ng-hide="isShow">
            User Name  <input type="text" required ng-model="userName" /><br /><br />
            Password <input type="password" required ng-model="password" /><br /><br />
            <input type="button" ng-disabled="form.$invalid" ng-click="isShow = true" value="Login" />
        </div>
        <div ng-show="isShow">
            Successfully Login.<br />
            <input type="button" ng-click="isShow = false;password='';userName=''" value="Logout" />
        </div>
    </form>
</body>
</html>

Output