javascript - Ionic V1.3 - 选项卡 - 带条件的徽章样式 <ion-tab>

Question

我正在使用 Ionic 并尝试在 <ion-tab> 内向徽章样式添加条件

<ion-tab title="style"
         icon-on="icon-payment_home" icon-off="icon-payment_home"
         badge-style="badge-assertive"
         badge="(calculateBadgeValue < 100) ? calculateBadgeValue + '%' : '&#10003'">
    <div class="custom-tab-scroll" ng-include src="'...'"></div>
</ion-tab>

是否可以为徽章样式添加条件？我想根据条件设置 css 类。

提前致谢

Answer 1

尝试这样的事情:

查看:

<ion-tab 
  ...
  badge="badge()" 
  badge-style="{{badge() ? 'badge-calm' : 'badge-assertive'}}">
  <ion-nav-view name="about-tab"></ion-nav-view>
</ion-tab>

或

<ion-tab 
  ...
  badge="badge()"
  badge-style="{{badgeStyle()}}">
  <ion-nav-view name="contact-tab"></ion-nav-view>
</ion-tab>

Controller :

$scope.badge = function(){
  return 3;
};
$scope.badgeStyle = function(){
  return 'badge-assertive';
};

CHECK THE DEMO