Hello everyone, I am going to
share the code sample for toggle(show/hide) div using ngShow, ngClick in
angularjs. The example detail as given below.
The
AngularJs Code sample as given below
var cartApp =
angular.module('sCartApp',
[]);
cartApp.controller('sCartCtrl', function($scope) {
$scope.ngShowhide = false;
$scope.ngShowhideFun = function(flag) {
if (flag) {
$scope.ngShowhide = false;
} else {
$scope.ngShowhide = true;
}
};
});
The HTML code sample as given
below
<div ng-app="sCartApp">
<div ng-controller="sCartCtrl">
<div ng-show="ngShowhide">
<div style=" background-color : yellow">
Hi This is body area!
</div>
</div>
</div>
</div>
The full
code HTML and javascript code sample as given below
<!DOCTYPE html>
<html>
<head>
<script src="http://code.angularjs.org/1.2.0-rc.2/angular.js"></script>
<script>
var cartApp =
angular.module('sCartApp',
[]);
cartApp.controller('sCartCtrl', function($scope) {
$scope.ngShowhide = false;
$scope.ngShowhideFun = function(flag) {
if (flag) {
$scope.ngShowhide = false;
} else {
$scope.ngShowhide = true;
}
};
});
</script>
</head>
<body ng-app="sCartApp">
<div ng-controller="sCartCtrl">
<a ng-click="ngShowhideFun(ngShowhide)">angularjs toggle
show hide button</a>
<div ng-show="ngShowhide">
<div style=" background-color : yellow">
Hi This is body area!
</div>
</div>
</div>
</body>
</html>Thank you!!