How to Hide Div After Some Time in AngularJS?

By Hardik Savani June 14, 2023 Category : Angular

Sometimes we require to do like hide div or text or any tag after some time using AngularJS. In this example i am going to show you how to do it.

AngularJS have $timeout variable, $timeout variable through we can set specific time after hide. We can easily set time for hide or show. In this simple example you can see how it is works.

Bellow example you can see and run bellow file in your machine.

Example:

Read Also: AngularJS Remove Duplicates Object from Array Example
<!DOCTYPE html>
<html>
<head>
	<title>Angularjs ng-hide div after few seconds</title>
	<script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
</head>
<body>
	<div ng-app = "mainApp" ng-controller = "myController">
		<p ng-hide="isCheck" style="background:red;padding:5px;">{{ myText }}</p>
        </div>

    <script>
            var mainApp = angular.module("mainApp", []);
	    mainApp.controller('myController', function($scope, $timeout) {
	      	$scope.myText = "This is for example";
	      	$scope.isCheck = false;

	      	$timeout(function () { $scope.isCheck = true; }, 4000);
	    });
  </script>

</body>
</html>

Tags :

We are Recommending you

Popular Posts

Categories

Latest Posts