我如何才能为mat-select做一个包装器，并且在它里面将是另一个用于mat-option的包装器，并且，在另一个组件中使用它

<mat-select [placeholder]="placeholder" [value]="selectedValue" (selectionChange)="onSelectionChange($event)">
  <mat-option *ngFor="let option of options" [value]="option.value">{{ option.label }}</mat-option>
</mat-select>

import { Component, Input, Output, EventEmitter } from '@angular/core';

@Component({
  selector: 'custom-select',
  templateUrl: './custom-select.component.html',
  styleUrls: ['./custom-select.component.css']
})
export class CustomSelectComponent {
  @Input() placeholder: string;
  @Input() options: any[];
  @Input() selectedValue: any;
  @Output() selectionChange: EventEmitter<any> = new EventEmitter();

  onSelectionChange(event: any) {
    this.selectionChange.emit(event.value);
  }
}

<custom-select [placeholder]="'Select an option'" [options]="selectOptions" [selectedValue]="selectedOption" (selectionChange)="onSelectionChange($event)"></custom-select>

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

@Component({
  selector: 'app-another-component',
  templateUrl: './another.component.html',
  styleUrls: ['./another.component.css']
})
export class AnotherComponent {
  selectOptions: any[] = [
    { value: 'option1', label: 'Option 1' },
    { value: 'option2', label: 'Option 2' },
    { value: 'option3', label: 'Option 3' }
  ];
  selectedOption: string;

  onSelectionChange(value: string) {
    this.selectedOption = value;
    // 执行其他逻辑
  }
}