javascript - ng-class expression: merge condition and class name -


supposing have 3 variables (they can change value):

$scope.a = 'one'; $scope.b = true; $scope.c = false; 
  • <div ng-class="a"></div> renders <div class="one">
  • <div ng-class="{'two': b, 'three': c}"></div> renders <div class="two">

how can merge variable , expression render <div class="one two">? have write function?

i tried: <div ng-class="[a, {'two': b}, {'three': c}]"></div>

i've got 2 solutions in mind :

see them working in plunker

first : in html

<div class="aclass {{a}}" ng-class="{'two': b, 'three': c}"></div> 

second : function

<div class="aclass" ng-class="getclasses()"></div> 

and in controller

$scope.a = 'one'; $scope.b = true; $scope.c = false;  $scope.getclasses = function(){     var classes = "";     classes += $scope.a;     if($scope.b) classes += " 2 ";     if($scope.c) classes += " 3 ";     return classes; } 

both result in

<div class="aclass 1 two"></div> 

Comments

Popular posts from this blog

Java 3D LWJGL collision -

spring - SubProtocolWebSocketHandler - No handlers -

methods - python can't use function in submodule -