Skip to content

Instantly share code, notes, and snippets.

/AngularJS-NgClass-Example.markdown

Created December 14, 2013 14:40
Show Gist options
  • Save anonymous/7959969 to your computer and use it in GitHub Desktop.
Save anonymous/7959969 to your computer and use it in GitHub Desktop.
Download ZIP
A Pen by mehmetcanker.
Raw
AngularJS-NgClass-Example.markdown
Raw
index.html
<html ng-app="mehmetCanker">
<head>
<link href="//cdn.jsdelivr.net/foundation/5.0.2/css/foundation.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.3/angular.min.js"></script>
</script>
</head>
<body>
<div ng-controller="ngClassExample" >
<button ng-model="classBool" ng-init="classBool=false" ng-click="changeCss()">{{stat}}</button>
<div ng-class="{panel:classBool}">Foundation Panel Block</div>
</div>
</body>
</html>
Raw
script.js
//More info htpp://mehmetcanker.com
//Module Defining
//Module Tanimlaniyor.
var myApp = angular.module('mehmetCanker', []);
//Creating Controller in mehmetCanker module
//Olusturulan module icine controller //tanimladik
myApp.controller('ngClassExample', ['$scope', function($scope){
//initial Value for Toggle Button Value
$scope.stat = "Show";
//changeCss Function
$scope.changeCss = function(){
$scope.classBool = !$scope.classBool;
//Toggle Button Value is changed by classBool
if($scope.classBool){
$scope.stat = "Hide";
}else{
$scope.stat = "Show";
}
}
}]);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment