如何将徽章添加到图标

Question

我需要在显示计数值的项目上的图标上添加徽章，我似乎无法使徽章起作用。谁能帮我这个？并使徽章在图标上显示计数值。

<div class="actions-bar" fxLayout="row" fxLayoutAlign="end center">
<label *ngIf="_dataSource.data.length > 0" class="mr-8">
<mat-icon class="mat-18 tick-icon">navigation</mat-icon>
<span>{{_dataSource.data.length}} locations</span>
</label>
<label *ngIf="_dataSource.data.length > 0" class="mr-8">
<mat-icon class="mat-18 warning-icon">warning</mat-icon>
<span>{{countWarningAddress()}} locations</span>
</label>
<label *ngIf="_dataSource.data.length > 0" class="mr-8">
<mat-icon matBadge="" matBadgeColor="accent" class="mat-18 tick- 
icon">check_circle</mat-icon>
<span>{{countValidAddress()}} locations</span>
</label>
<label *ngIf="_dataSource.data.length > 0" class="mr-8">
<mat-icon class="mat-18 flag-icon">flag</mat-icon>
<span>{{countInvalidAddress()}} locations</span>
</label>

Answer 1

如果您正在谈论混合移动应用徽章，则可以添加插件https://www.npmjs.com/package/cordova-plugin-badge作为徽章并使用

cordova.plugins.notification.badge.set（count）;