解决方法是使用Angular Material的ChangeDetectorRef服务来手动触发渲染。

首先，确保你已经导入了ChangeDetectorRef服务：

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

然后，在组件的构造函数中注入ChangeDetectorRef服务：

constructor(private cdr: ChangeDetectorRef) { }

接下来，在需要手动触发渲染的地方调用detectChanges()方法：

this.cdr.detectChanges();

以下是一个完整的示例代码：

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

@Component({
  selector: 'app-example',
  template: `
    
Loading...
    
Content loaded!
    Load Content
  `,
})
export class ExampleComponent {
  isLoading = false;

  constructor(private cdr: ChangeDetectorRef) { }

  loadContent() {
    this.isLoading = true;
    // 模拟异步加载数据
    setTimeout(() => {
      this.isLoading = false;
      this.cdr.detectChanges(); // 手动触发渲染
    }, 2000);
  }
}

在上面的示例中，当用户点击"Load Content"按钮时，组件的isLoading属性会被设置为true，然后通过setTimeout模拟异步加载数据。当数据加载完成后，isLoading属性会被设置为false，然后使用cdr.detectChanges()手动触发渲染，以更新模板中的内容。这样，用户将能够看到"Content loaded!"的消息。