如何使用异步管道的mat-option值？

<mat-form-field>
  <mat-select [(ngModel)]="selectedValue">
    <mat-option *ngFor="let option of options$ | async" [value]="option.value">
      {{ option.label }}
    </mat-option>
  </mat-select>
</mat-form-field>

import { Component } from '@angular/core';
import { Observable } from 'rxjs';
import { Option } from './option.model';
import { OptionService } from './option.service';

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
  styleUrls: ['./my-component.component.css']
})
export class MyComponent {
  options$: Observable<Option[]>;

  constructor(private optionService: OptionService) {
    this.options$ = this.optionService.getOptions();
  }
}

import { Injectable } from '@angular/core';
import { Observable, of } from 'rxjs';
import { delay } from 'rxjs/operators';
import { Option } from './option.model';

@Injectable({
  providedIn: 'root'
})
export class OptionService {
  getOptions(): Observable<Option[]> {
    // 模拟异步获取数据
    return of([
      { value: 'option1', label: 'Option 1' },
      { value: 'option2', label: 'Option 2' },
      { value: 'option3', label: 'Option 3' }
    ]).pipe(delay(1000)); // 延迟1秒模拟异步操作
  }
}