在Angular中，mat-badge可以用于在图标、按钮等元素上显示动态数据。然而，当数据动态变化时，mat-badge的效果可能不佳，因为它不会自动更新。为了解决这个问题，你可以使用Angular的ChangeDetectorRef来手动更新mat-badge。

以下是一个示例代码，演示了如何在动态数据上更新mat-badge：

import { Component, ChangeDetectorRef } from '@angular/core';

@Component({
  selector: 'app-example',
  template: `
    {{badgeValue}}
    增加
  `,
})
export class ExampleComponent {
  badgeValue: number = 0;

  constructor(private cdr: ChangeDetectorRef) {}

  increaseBadge() {
    this.badgeValue++;
    this.cdr.detectChanges();
  }
}

在上面的代码中，我们创建了一个按钮和一个用于增加badge值的按钮。当点击增加按钮时，badgeValue会增加，并调用ChangeDetectorRef的detectChanges()方法来手动更新mat-badge。

通过这种方式，你可以确保mat-badge能够正确显示动态数据。