如果没有第一个css类,如何应用其他css类?

时间:2015-12-17 07:58:18

标签: angularjs ionic-framework ionic css-sprites sprite-sheet

我正在使用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>

所以,如果&#34; product.type&#34;是不同的东西,它应该应用类图标 - NOIMAGE。

我尝试过使用ng-class this但它没有用。因为它们没有条件可以检查。需要查找是否存在css类。 尝试过:

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

解决方案之一:通过添加icon-NOIMAGE类。但在某些情况下它失败了。

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

是他们检查css类是否存在的任何方法。?

他们有什么不同的方式,我可以做..?

1 个答案:

答案 0 :(得分:2)

如果你想有条件地申请课程,你应该使用ng-class。

ng-class="{'yourclass' : variable == 'value'}"