Установите значение по умолчанию для выбора матов, только если присутствует только одно значение
У меня есть 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
}