How to hide div after some time using AngularJS?

By Hardik Savani | September 9, 2016 | | 4728 Viewer | Category : AngularJS


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:

<!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>






Do you want to expert php developer or developer team for your projects ?
Contact US
We are Recommending you: