How to replace css class value using angularjs values?

Question

I have a problem now to make my css values dynamic. I have this kind of code but not working

<style>
    .panel-primary {
         background-color:{{myColorPanel}}
    }
</style>

I've seen this post from this link

How to Dynamically create a CSS class using AngularJS

i don't know what is my mistakes there that it didn't work.

Anyone have an alternative solution to my problem.

I just want to make bootstrap panel to be customized in colors and i don't want to put ng-class or ng-style in every panel i used coz it is so many.

Anyone have an idea please let me know.

Full Code

    <!DOCTYPE html>
<html data-ng-app="Aptus">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" charset="utf-8">
    <title>Centralized Test</title>
    <!--<link href="http://cdn.dbtc.sdb.ph/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" />-->
    <link href="contents/css/angucomplete.css" rel="stylesheet" />
    <link href="contents/css/bootstrap.min.css" rel="stylesheet" />
    <link href="contents/css/dashboard.css" rel="stylesheet" />
    <link href="contents/css/loading-bar.css" rel="stylesheet" />
    <link href="contents/css/loading-bar.min.css" rel="stylesheet" />
    <link href="contents/css/font-awesome.min.css" rel="stylesheet" />
    <link href="contents/css/cropper.min.css" rel="stylesheet" />
    <link href="styles/myStyles.css" rel="stylesheet" />
    <link href="contents/css/elusive-webfont.css" rel="stylesheet" />
    <link href="contents/css/bootstrap-datetimepicker.min.css" rel="stylesheet" />
    <link href="contents/css/angular-chart.css" rel="stylesheet" />
    <link href="Scripts/ckeditor/contents.css" rel="stylesheet" />
    <link href="Contents/css/colorpicker.min.css" rel="stylesheet" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
        .ng-ckeditor {
            border: 0;
        }

        body {
            overflow-x: hidden;
        }

        #sidebar-dropdown {
            color: #9a96a1 !important;
        }

        .form-control {
            border-radius: 0 !important;
        }

        .modal .modal-body {
            max-height: 450px !important;
            overflow-y: auto;
        }

        @media (max-width:767px) {
            .small-width-hidden {
                display: none;
            }
        }

        @media screen {
            footer {
                display: none;
            }
        }

        @media print {
            .progress {
                background-color: #F5F5F5 !important;
                -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#F5F5F5', endColorstr='#F5F5F5')" !important;
            }

            .progress-bar-success {
                display: block !important;
                background-color: #198718 !important;
                -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#198718', endColorstr='#198718')" !important;
            }

            .progress-bar-info {
                display: block !important;
                background-color: #5BC0DE !important;
                -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#5BC0DE', endColorstr='#5BC0DE')" !important;
            }

            .progress, .progress > .progress-bar {
                display: block !important;
                -webkit-print-color-adjust: exact !important;
                box-shadow: inset 0 0 !important;
                -webkit-box-shadow: inset 0 0 !important;
            }

            .not-printable {
                display: none;
            }

            .additional {
                display: inline-block !important;
            }

            .printable {
                position: absolute;
                width: 100%;
                height: 100%;
                top: 0;
                left: 0;
                padding: 10px;
            }

            .small-font {
                font-size: 8pt !important;
            }

            .small-padding > tbody > tr > td {
                padding-top: 1px !important;
                padding-bottom: 1px !important;
                margin: 1px !important;
            }

            .small-padding > tbody > tr > th {
                padding-top: 1px !important;
                padding-bottom: 1px !important;
                margin: 1px !important;
            }

            .small-padding > table {
                padding: 1px !important;
            }

            .small-font > span {
                font-size: 6pt !important;
            }

            footer {
                position: fixed !important;
                bottom: 0 !important;
            }

            @page {
                size: auto;
                margin: 5mm;
            }
        }

        #CriteriaTable > tr > th {
            padding-top: 0px !important;
            padding-bottom: 0px !important;
        }

        .dashboardsubmenu {
            list-style-type: none;
            padding-left: 10px;
        }

        .tab-content {
            border-right: solid 1px #ddd;
            border-left: solid 1px #ddd;
            border-bottom: solid 1px #ddd;
        }

        #icon-tab > li > a {
            border-radius: 0 !important;
        }

        #loading-bar-spinner .spinner-icon {
            width: 14px;
            height: 14px;
            border: solid 2px transparent;
            border-top-color: red;
            border-left-color: red;
            border-radius: 10px;
            -webkit-animation: loading-bar-spinner 400ms linear infinite;
            -moz-animation: loading-bar-spinner 400ms linear infinite;
            -ms-animation: loading-bar-spinner 400ms linear infinite;
            -o-animation: loading-bar-spinner 400ms linear infinite;
            animation: loading-bar-spinner 400ms linear infinite;
        }

        #loading-bar .bar {
            background: red;
        }

        #loading-bar .peg {
            display: block;
            position: absolute;
            right: 0px;
            width: 100px;
            height: 100%;
            box-shadow: 0 0 1px red, 0 0 1px red;
            opacity: 1.0;
            -webkit-transform: rotate(3deg) translate(0px, -4px);
            -moz-transform: rotate(3deg) translate(0px, -4px);
            -ms-transform: rotate(3deg) translate(0px, -4px);
            -o-transform: rotate(3deg) translate(0px, -4px);
            transform: rotate(3deg) translate(0px, -4px);
        }

        /************For Angular-Modal****************/
        @media (max-width:530px) {
            .message {
                width: 100% !important;
            }
        }
        /*******************************************/
        a:not(:hover) {
            text-decoration: none !important;
        }

        .modal-content {
            border-radius: 0;
        }

        .go-top {
            position: fixed;
            bottom: 1em;
            left: 1em;
            text-decoration: none;
            color: white;
            background-color: rgba(0, 0, 0, 0.3);
            font-size: 12px;
            padding: 1em;
            display: none;
        }

            .go-top:hover {
                background-color: rgba(0, 0, 0, 0.8);
                color: white;
            }

        .math-tex {
            font-size: 20px !important;
        }

        table.floatThead-table {
            border-top: none;
            border-bottom: none;
            background-color: #fff;
        }

    </style>
    <script type="text/x-mathjax-config">
        MathJax.Hub.Config({
        extensions: ["tex2jax.js"],
        jax: ["input/TeX","output/HTML-CSS"],
        tex2jax: {
        inlineMath: [['$','$'], ['\\(','\\)']],
        processEscapes: true
        }
        });
    </script>
    <script type="text/javascript" src="Scripts/MathJax/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script><!---->
    <!-- <script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
    <script type="text/javascript"
        src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
      </script>-->
</head>
<body data-ng-cloak="" data-ng-controller="indexController">
    <style>
        .panel-primary {
            background-color:{{myColorPanel}}
        }
    </style>
    <div class="container">
        <div class="row">
            <div class="wrapper">
                <div class="sidebar-wrapper not-printable">
                    <div class="sidebar not-printable" style="margin-bottom:10px">
                        <a href="#" class="logo">Centralized Test</a>
                        <div class="user-panel">
                            <div class="pull-left image">
                                <img src="Contents/images/photo.png" class="circular" alt="User Image" />
                            </div>
                            <div class="pull-left info">
                                <p>Hello {{lastName}}</p>

                                <a class="cursor-pointer" data-ng-click="logOut()">Log Out</a>
                            </div>
                        </div>
                        <ul class="nav nav-pills nav-stacked">
                            <li><a class="cursor-pointer">Dashboard</a></li>
                            <li id="sidebar-dropdown" data-ng-repeat="mod in modulesData | filter:{userRoleName:currentRole || ''}" data-ng-class="{'active' : activeModule == mod.moduleId}">
                                <a href="{{mod.moduleUrl}}" data-toggle="collapse" data-target="#{{mod.moduleId}}" data-ng-click="setCurrentModule(mod);SetActiveModule(mod.moduleId)">
                                    <span class="pull-right"><span class="caret" data-ng-show="mod.moduleUrl == '#' || mod.moduleUrl == ''"></span></span><i class="{{mod.iconUrl}}"></i> &nbsp;&nbsp;&nbsp;<span>{{mod.moduleName}}</span>
                                </a>
                                <ul class="collapse dashboardsubmenu" id="{{mod.moduleId}}" style="list-style-type: none">
                                    <li class="list-group-item no-border" data-ng-repeat="sub in mod.subModule | filter:{userRoleName:currentRole || ''}"><a href="{{sub.moduleUrl}}" data-ng-click="setCurrentModule(sub)"><i class="{{sub.iconUrl}}"></i>&nbsp;&nbsp;&nbsp;<span>{{sub.moduleName}}</span></a></li>
                                </ul>
                            </li>
                        </ul>
                    </div>
                </div>

                <div class="content-wrapper">
                    <div class="content">
                        <div class="container not-printable">
                            <div class="row">
                                <div class="header">
                                    <nav class="navbar navbar-static-top navigation" role="navigation">

                                        <a class="navbar-toggle navbar-left cursor-pointer" role="button" id="toggle-button">
                                            <span class="icon-bar"></span>
                                            <span class="icon-bar"></span>
                                            <span class="icon-bar"></span>
                                        </a>
                                        <div class="navbar-left">
                                            <ul class="nav navbar-nav">
                                                <li><a class="cursor-pointer" href="#/home" data-ng-click="setCurrentModule('Dashboard')" style="color:white !important"><span class="fa fa-home fa-lg"></span></a></li>
                                                <li class="dropdown" data-ng-show="iTestRoles.length>0">
                                                    <a class="cursor-pointer dropdown-toggle" data-toggle="dropdown-menu" data-target="#Roles">{{currentRole}} <span class="caret"></span></a>
                                                    <ul class="dropdown-menu" id="Roles">
                                                        <li data-ng-repeat="data in iTestRoles"><a class="cursor-pointer" data-ng-click="SetiTestRole(data.userRoleName,data.userRoleId)">{{data.userRoleName}}</a></li>
                                                    </ul>
                                                </li>
                                                <li class="dropdown" data-ng-show="iTestSubjectGrade.length>0">
                                                    <a class="cursor-pointer dropdown-toggle" data-toggle="dropdown-menu" data-target="#SubGrade">{{subject}} {{grade}}<span class="caret"></span></a>
                                                    <ul class="dropdown-menu" id="SubGrade">
                                                        <li data-ng-repeat="data in iTestSubjectGrade"><a class="cursor-pointer" data-ng-click="SetiTestSubGrade(data.subject,data.grade,data.subjectCode,data.gradeID)">{{data.subject}} {{data.grade}}</a></li>
                                                    </ul>
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="navbar-right right-nav">
                                            <ul class="nav navbar-nav">
                                                <li class="dropdown">
                                                    <a class="dropdown-toggle cursor-pointer" data-toggle="dropdown-menu" data-target="ProfileMenu">
                                                        <i class="fa fa-user"></i> &nbsp;&nbsp;{{firstName
                                                        }} {{middleInitial}} {{lastName}} <span class="caret"></span>
                                                    </a>
                                                    <ul class="dropdown-menu" id="ProfileMenu">
                                                        <!-- User image -->
                                                        <li class="user-header bg-light-green">
                                                            <img src="Contents/images/photo.png" class="circular" alt="User Image" />
                                                            <p>
                                                                {{firstName}} {{middleInitial}} {{lastName}}
                                                                <!--- {{userRole}}-->
                                                                <small></small>
                                                            </p>
                                                        </li>
                                                        <!-- Menu Body -->
                                                        <li class="user-body">
                                                            <!-- <div class="col-xs-4 text-center">
                                                                        <a href="#">Followers</a>
                                                                    </div>
                                                                    <div class="col-xs-4 text-center">
                                                                        <a href="#">Sales</a>
                                                                    </div>
                                                                    <div class="col-xs-4 text-center">
                                                                        <a href="#">Friends</a>
                                                                    </div>-->
                                                        </li>
                                                        <!-- Menu Footer-->
                                                        <li class="user-footer">
                                                            <div class="pull-left">
                                                                <a class="btn btn-default btn-flat cursor-pointer">Profile</a>
                                                            </div>
                                                            <div class="pull-right">
                                                                <a class="btn btn-default btn-flat cursor-pointer" data-ng-click="logOut()">Sign out</a>
                                                            </div>
                                                        </li>
                                                    </ul>
                                                </li>
                                            </ul>
                                        </div>
                                    </nav>
                                </div>
                            </div>
                        </div>

                        <div class="container">
                            <div class="row not-printable" id="content-title">
                                <h3>{{currentModule.moduleDescription}}</h3>
                            </div>
                            <div class="row" id="content">
                                <div data-ng-view="" class="printable">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <a href="#" class="go-top text-center not-printable">
            <span class="fa fa-chevron-circle-up not-printable" style="font-size:32px"></span><br />
            <span class="not-printable">Go to Top</span>
        </a>
    </div>

    <div id="icon" class="modal fade" data-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content" style="border-radius:0">
                <div class="modal-header" style="border-radius:0;background-color:#3c8dbc">
                    <label class="modal-title" style="color:white">Icons</label>
                </div>
                <div class="modal-body">

                    <ul class="nav nav-tabs cursor-pointer" role="tablist" id="icon-tab">
                        <li class="active"><a class="cursor-pointer" role="tab" data-toggle="tab" data-target="#glyphicons">Glyphicons</a></li>
                        <li><a role="tab" data-toggle="tab" data-target="#font-awesome">Font-Awesome</a></li>
                        <li><a role="tab" data-toggle="tab" data-target="#elusive">Elusive-Icon</a></li>
                    </ul>

                    <!-- Tab panes -->
                    <div class="tab-content">
                        <div class="tab-pane active" id="glyphicons">
                            <div class="row">
                                <div class="col-md-12">
                                    <div class="col-xs-1 col-md-1 cursor-pointer" data-ng-repeat="glyph in ModuleIcons.GlyphIcons" style="padding:10px"><span class="{{glyph.Name}}"></span></div>
                                </div>
                            </div>
                        </div>
                        <div class="tab-pane" id="font-awesome">
                            <div class="row">
                                <div class="col-md-12">
                                    <div class="col-xs-1 col-md-1 cursor-pointer" data-ng-repeat="awesome in ModuleIcons.FontAwesome" style="padding:10px"><span class="{{awesome.Name}}"></span></div>
                                </div>
                            </div>
                        </div>
                        <div class="tab-pane" id="elusive">
                            <div class="row">
                                <div class="col-md-12">
                                    <div class="col-xs-1 col-md-1 cursor-pointer" data-ng-repeat="elusive in ModuleIcons.ElusiveIcon" style="padding:10px"><span class="{{elusive.Name}}"></span></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer" style="border-radius:0">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <button type="button" class="btn btn-primary" data-ng-click="Submit(classes,enrollCodes)">Continue</button>
                </div>
            </div>
        </div>
    </div>

    <script type="text/ng-template" id="warning-dialog.html">
        <div class="modal-header" style="border-radius:0">
            <h4 style="font-weight:bolder" class="text-center">You're Idle. Do Something!</h4>
        </div>
        <div ng-idle-countdown="countdown" ng-init="countdown=10" class="modal-body" style="border-radius:0">
            <progressbar max="10" value="10" animate="false" class="progress-striped active">You'll be logged out in {{countdown}} second(s).</progressbar>
        </div>
    </script>
    <script type="text/ng-template" id="timedout-dialog.html">
        <div class="modal-header">
            <h3>You've Timed Out!</h3>
        </div>
        <div class="modal-body">
            <p>
                You were idle too long. Normally you'd be logged out, but in this demo just do anything and you'll be reset.
            </p>
        </div>
    </script>


    <script src="scripts/jquery-1.11.1.min.js"></script>
    <script src="scripts/bootstrap.min.js"></script>
    <script src="scripts/angular.min.js"></script>
    <script src="scripts/angular-route.min.js"></script>
    <script src="scripts/angular-local-storage.min.js"></script>
    <script src="scripts/loading-bar.min.js"></script>
    <script src="scripts/ui-bootstrap-tpls-0.11.0.min.js"></script>
    <script src="scripts/angular-idle.min.js"></script>
    <script src="scripts/angucomplete-alt.min.js"></script>
    <script src="scripts/moment.min.js"></script>
    <script src="scripts/bootstrap-datetimepicker.min.js"></script>
    <script src="scripts/cropper.min.js"></script>
    <script src="scripts/dashboard.js"></script>
    <script src="scripts/ckeditor/ckeditor.js"></script>
    <script src="scripts/Chart.min.js"></script>
    <script src="scripts/angular-chart.js"></script>
    <script src="Scripts/ng-ckeditor.js"></script>
    <script src="Scripts/angularjs-unique.js"></script>

    <script src="Scripts/bootstrap-colorpicker-module.min.js"></script>

    <script src="app/app.js"></script>
    <script src="app/Controllers/IndexController.js"></script>
    <script src="app/Controllers/loginController.js"></script>
    <script src="app/Services/authInterceptorService.js"></script>
    <script src="app/Services/authService.js"></script>
    <script src="app/Controllers/HomeController.js"></script>
    <script src="app/Services/HomeService.js"></script>
    <script src="app/Filters/Filter.js"></script>
    <script src="app/Controllers/SetupController.js"></script>
    <script src="app/Services/SetupService.js"></script>
    <script src="app/Directives/Directives.js"></script>
    <script src="app/Controllers/TestController.js"></script>
    <script src="app/Services/TestService.js"></script>
    <script src="app/Controllers/ITestController.js"></script>
    <script src="app/Services/ITestService.js"></script>
    <script src="app/Services/SignalRService.js"></script>
    <script src="Scripts/jquery.floatThead.min.js"></script>
    <script src="app/Controllers/ActivateExamController.js"></script>
    <script src="app/Services/ExamActivationService.js"></script>

    <script type="text/javascript">
        $('#icon-tab a').click(function (e) {
            e.preventDefault()
            $(this).tab('show')
        });
        //$.fn.modal.Constructor.prototype.enforceFocus = function () {
        //    modal_this = this
        //    $(document).on('focusin.modal', function (e) {
        //        if (modal_this.$element[0] !== e.target && !modal_this.$element.has(e.target).length
        //        && !$(e.target.parentNode).hasClass('cke_dialog_ui_input_select')
        //        && !$(e.target.parentNode).hasClass('cke_dialog_ui_input_text')) {
        //            modal_this.$element.focus()
        //        }
        //    })
        //};

        $(document).ready(function () {
            // Show or hide the sticky footer button
            $(window).scroll(function () {
                if ($(this).scrollTop() > 200) {
                    $('.go-top').fadeIn(200);
                } else {
                    $('.go-top').fadeOut(200);
                }
            });

            // Animate the scroll to top
            $('.go-top').click(function (event) {
                event.preventDefault();

                $('html, body').animate({ scrollTop: 0 }, 300);
            })
        });

    </script>
</body>
</html>

so it means i will alter every panel that I'm using? no other easier ways? — Datz Me
– Datz Me, Commented Feb 16, 2016 at 6:31
that should work. do you see the correct color when you inspect the dom? — FuzzyTree
– FuzzyTree, Commented Feb 16, 2016 at 6:32
Use this <style>.panel-primary { background-color:{{myColorPanel}} !important; } </style> ... Might be there is overlapping any other class so make this important and then check — Vishal Sharma
– Vishal Sharma, Commented Feb 16, 2016 at 6:33

8eecf0d2 · Accepted Answer · 2016-02-16 06:36:46Z

1

I've provided a simple example below as to how you can switch classes, not directly modify the classes, however that's not a very typical procedure.

function MyCtrl($scope) {
    $scope.myClass = 'blue'
}

.blue { color: blue }
.red { color: red }

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app ng-controller="MyCtrl">
  <h2 ng-class="myClass" ng-click="myClass = myClass == 'blue' ? 'red' : 'blue'">Click Me!</h2>
</div>

answered Feb 16, 2016 at 6:36

8eecf0d2

1,5891 gold badge13 silver badges23 bronze badges

1

The color should be come from my database. There is no problem with ng-class and ng-style but the thing is that the system is existing and a lots of panel used. So im trying not to make a lot of changes by making a class with a value so that all the panel will just change.

Datz Me
– Datz Me

02/16/2016 06:39:25
Commented Feb 16, 2016 at 6:39

Add a comment |

sagar chopada · Accepted Answer · 2016-02-16 06:48:06Z

<html>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
    
    <script>
      angular.module("myApp",[]).controller("myController",function($scope){
      $scope.name="sagar";
        $scope.myColorPanel ="green";
        $scope.colorChange=function(color){
         $scope.myColorPanel =color;
        }
      });
    </script>
    </head>
  <body ng-app="myApp" ng-controller="myController">
    <style>
        .panel-primary {
             background-color:{{myColorPanel}};
        }
    </style>
  <div class="panel-primary"><h3>{{name}} ,dynamic Color Change By Angularjs</h3></div>
    <button ng-click="colorChange('red')">Red</button>
    <button ng-click="colorChange('blue')">Blue</button>
    <button ng-click="colorChange('pink')">Pink</button>
    <button ng-click="colorChange('yellow')">Yellow</button>
    
  </body>
  </html>

Hope That Was Help you..

Thank you for the effort dude but still the same with mine and didn't work which i don't really know why. — Datz Me
– Datz Me, Commented Feb 16, 2016 at 6:53

Datz Me · Accepted Answer · 2016-02-18 02:43:46Z

1

Now I found the real problem. Its the version of the angularjs that i use didn't support angularjs in style. Since it is an existing system, the angularjs used is older version. The version I previously used is 1.2x then i updated it to newer version (1.5x) and all the code I used is now working. Thank a lot for all the effort of you guys. I know its my fault not realized about the version of angularjs but thank you so much.

The solution was changing from old version to newer version.

answered Feb 18, 2016 at 2:43

Datz Me

9551 gold badge10 silver badges27 bronze badges

Add a comment |

Nirmal Borkar · Accepted Answer · 2016-02-16 06:35:33Z

0

ng-class is the best option if you want it to work using AngularJs. You can check this article.Hopefully this will give you the solution to your problem.

answered Feb 16, 2016 at 6:35

Nirmal Borkar

1263 bronze badges

Add a comment |

Mohayemin · Accepted Answer · 2016-02-16 06:35:48Z

0

I think it should work.

May be there are other places where background color on .panel-primary is being set.

You are using bootstrap, right? Make sure your custom CSS is loaded after bootstrap's CSS.

answered Feb 16, 2016 at 6:35

Mohayemin

3,8704 gold badges29 silver badges55 bronze badges

Add a comment |

Partha Sarathi Ghosh · Accepted Answer · 2016-02-16 06:37:47Z

0

Put the style tag inside your controller, not in the head tag as follows

<body ng-controller="MainCtrl">
    Background of div is <input ng-model="name">
    <style>
      .p { background-color: {{name}}; }
    </style>
    <div class="p">dddd</div>
  </body>

answered Feb 16, 2016 at 6:37

Partha Sarathi Ghosh

11.7k22 gold badges64 silver badges84 bronze badges

yes i did.. <body data-ng-cloak="" data-ng-controller="indexController"> <style> .panel-primary { background-color:{{myColorPanel}} } </style></body> (Sample instances)

Datz Me
– Datz Me

02/16/2016 06:40:10
Commented Feb 16, 2016 at 6:40
Please create a plunker if possible. At the time of creating plunker you may found solution.

Partha Sarathi Ghosh
– Partha Sarathi Ghosh

02/16/2016 06:41:22
Commented Feb 16, 2016 at 6:41

Add a comment |

Collectives™ on Stack Overflow

How to replace css class value using angularjs values?

6 Answers 6

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Your Answer

Sign up or log in

Post as a guest

Linked

Related