Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
  • Adding CSS on a click in AngularJs

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 43
    Comment on it

    If you want to add some css or change css on a button click in angularjs,you need to use angular directive mg-class for this.

    It is very simple you just need to bind a variable into the directive mg-class and change it from the controller.

    Here is the HTML:

    <html ng-app="app">
        <title>Change on click</title>
      <body ng-controller=Change>
        <div ng-class=Changecss>{{Changecss}}</div>
        <button ng-click="changeColor()>Change Color</button>
        <script type="text/javascript" src="js/angular.min.js"></script>
        <script type="text/javascript" src="js/example.js"></script>>

    Now below is the js code you need to add to your controller.

    var app = angular.module("app",[]);
            $scope.Changecss = green;
            $scope.changeColor = function(){
              if ($scope.Changecss === green)
                $scope.Changecss = "blue";
                $scope.Changecss = green;

    Now you need to define class in your css.


 0 Comment(s)

Sign In

Sign up using

Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: