0

i am using Image sprites.Some Image sprites CSS class:

.icon-ONE {
  background-image: url(../img/spritesheet.png);
  background-position: -32px 0px;
  width: 32px;
  height: 32px;
}
.icon-TWO {
  background-image: url(../img/spritesheet.png);
  background-position: -288px -288px;
  width: 32px;
  height: 32px;
}
.icon-NOIMAGE {
  background-image: url(../img/spritesheet.png);
  background-position: 0px -32px;
  width: 32px;
  height: 32px;
}

HTML : 

 <div ng-repeat="product in products">
      <div ng-show="product.type!=''" class="icon-{{product.type | removeSpace | uppercase}} " ></div>
      <div ng-show="!product.type || product.type==''" class=" icon-NOIMAGE" ></div>
 </div>

so,if "product.type" is something different,it should apply class icon-NOIMAGE.

i have tried using ng-class this but it didnt work.as their is no condition to check.need to find if css class exist. have tried :

angular.element(myElement).hasClass('my-class');

One of the solution : by adding icon-NOIMAGE class.but it failed in some conditions. 

 <div ng-show="product.type!=''" class="icon-{{product.type | removeSpace | uppercase}} icon-NOIMAGE" ></div>

is their any way to check if css class exists.?

is their any different way for this,i can do..?

Community
  • 1
  • 1
the_mahasagar
  • 1,201
  • 2
  • 16
  • 24

1 Answers1

2

If you want apply class conditionally you should use ng-class.

ng-class="{'yourclass' : variable == 'value'}"
Michał Dopieralski
  • 450
  • 2
  • 14