tabs - ionic 标签徽章

Question

我正在尝试在选项卡中的图标上添加徽章。
当前结果是:http://play.ionic.io/app/decfc14cb171

有谁知道如何将它们放在每个图标的右上角？

我尝试使用 但事实证明，在其他方面问题更多，尽管带有“徽章”属性更容易达到预期效果。有没有办法在不使用 ion-tabs 的情况下复制它？

Answer 1

[ 仅适用于 ioinc 1 ]

看到这个:http://play.ionic.io/app/52586f24b84d
您需要创建一个具有相对位置的类

.badge-container{
      position: relative;
}

并将其分配给 <i>这样标记，徽章会自动调整

<i class="icon ion-home badge-container"><span class="badge badge-assertive">3</span></i>

其他标签也一样

<i class="icon ion-ios-paper badge-container"><span class="badge badge-assertive">5</span></i>

现在，您还可以通过为徽章提供边距等来更改徽章的进一步位置。