Create a second dynamic ion-select

good afternoon, i’m trying to create two ion-select, in which the second presents only the information of the option selected in the first ion-select


    <ion-label> {{servicoDesejado}} </ion-label>
    <ion-select [(ngModel)]="selectedVal" (ionChange)="selectServicoDesejado($evento)">
      <ion-select-option *ngFor="let servico of servicos" [value]="">

    <ion-select id='profissional' [(ngModel)]="selectedVal2" disable={{isEnabled}}>
      <ion-select-option *ngFor="let profissional of profissionais" [value]=
      ""> {{}} </ion-select-option>


export class AgendarPage implements OnInit {
  public servicoDesejado = "Serviço Desejado";
  public profissionalServico = "Profissional";

  constructor(public navegacao: NavController, private platform: Platform) { 
    this.platform.ready().then(()=> {
      this.servicos = [{
        name: "Cor", 
        profession: [{
          prof: "Azul"},{
          prof: "Amarelo"},{
          prof: "Vermelho"
      }, {
        name: "Roupa"
      }, {
        name: "Número"
      }, {
        name: "Letra"