我希望在单击按钮时动态更新徽章值.
tabs.html
...
<ion-tab [root]="tab1Root" tabTitle="Product" tabIcon="search"></ion-tab>
<ion-tab [root]="tab2Root" tabTitle="Cart" tabIcon="cart" tabBadge="{{cartCount}}" tabBadgeStyle="danger"></ion-tab>
...
Run Code Online (Sandbox Code Playgroud)
tabs.ts
export class TabsPage {
...
cartCount = 0;
tab1Root = ProductPage;
tab2Root = CartPage;
...
}
Run Code Online (Sandbox Code Playgroud)
product.html
<button ion-button full (click)="updateCart('add', p.id)">Buy Now</button>
Run Code Online (Sandbox Code Playgroud)
product.ts
export class ProductPage {
...
updateCart(action, id) {
let cartCount = 1;
let alert = this.alertCtrl.create({
title: 'Success!',
subTitle: 'You have added 1 product to the cart.',
buttons: ['OK']
});
alert.present();
}
...
}
Run Code Online (Sandbox Code Playgroud)
正如我所说,let cartCount = 1;什么都不做.我已经找到了一个解决方案,但大多数都是针对Ionic 1或AngularJS,它根本没有帮助我.