Ng-Show-Ng-Hide-6

 
In this example we can check the number whether it is even or odd based on isHide variable.On ng-keyup event we can call the function checkNumber(val),val is variable with ng-model directive which will set the value of textbox to val.In checkNumber() we can calculate the modulus val variable value and set to the isHide.If isHide is false then number is even otherwise number is odd.
 
 
 
<!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="app"> <div ng-controller="controllerName" ng-init="val=0"> <div class="row"> <div class="col-md-6"> Enter a number: <input type="text" ng-model="val" ng-keyup="checkNumber(val)" /> </div> <div class="col-md-6"> <div ng-hide="isHide"><h3>The number is even</h3></div> <div ng-show="isHide"><h3>The number is odd</h3></div> </div> </div> </div> <script> var app = angular.module("app", []); app.controller('controllerName', ['$scope', function ($scope) { $scope.checkNumber = function (val) { $scope.isHide = val % 2 == 0 ? false : true; }; }]); </script> </body> </html>
Output