Установите значение по умолчанию для выбора матов, только если присутствует только одно значение

У меня есть mat-select в моем угловом проекте, который принимает значения с сервера и показывает их. Что мне нужно сделать, так это убедиться, что в случае, если полученное значение равно 1, отображать его как значение по умолчанию, но только в этом случае, поскольку значения не определены заранее. Есть ли способ сделать это?

HTML:

          <div class="combo">
    <div>
        <mat-form-field appearance="outline" class="calendarfilter">
            <mat-label>Utente</mat-label>
            <mat-select (selectionChange)="filteredUsers.emit($event.value)" [value]="null">
              <mat-option *ngFor="let user of users" [value]="user.id">
                {{user.descrizione}}
              </mat-option>
            </mat-select>
          </mat-form-field>
    </div>
    </div> 

TS:

              import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
    import { UtentiAgenda } from 'src/app/models/EventoServer';
    
    @Component({
      selector: 'app-user-filter',
      templateUrl: './user-filter.component.html',
      styleUrls: ['./user-filter.component.css']
    })
    export class UserFilterComponent implements OnInit {
      @Input() users: UtentiAgenda[]
      @Output() filteredUsers: EventEmitter<number>= new EventEmitter()
      constructor() { }
    
      ngOnInit(): void { 
      }
    
    }

HTML в домашнем компоненте:

          <app-user-filter class="filterbar" *ngIf="release=='wincar' && userAgenda != null" [users]="userAgenda" (filteredUsers)="userChanged($event)">
        </app-user-filter>

1 ответ

Просто добавь <mat-select (selectionChange)="filteredUsers.emit($event.value)" [(value)]="selectedValue">

и установите selectedValue в свой ts внутри условия if, например

      if(this.users.length === 1){
    this.selectedValue = this.users.descrizione; //or according to your users structure
  }
Другие вопросы по тегам