Angular2 Значення за замовчуванням для вибраного тегу - кутовий, html-select

Я намагаюся встановити значення за замовчуванням для мого тесту "select" у кутовій частині2 відповідно до моделі

Ось мій код:

HTML

<div>
<label>Agence: </label>
<select [(ngModel)]="candidat.agence">
<option *ngFor="let agence of agences" [ngValue]="agence">{{agence.nom}}</option>
</select>
</div>

КОМПОНЕНТ

export class CandidatDetailComponent implements OnInit {
@Input()
candidat: Candidat;

agences: Agence[];

constructor(
private agenceService: AgenceService,
) {}

ngOnInit(): void {
this.agenceService.getAgences().then(agences => this.agences = agences);
}
}

АГЕНТА

export class Agence {
id: number;
nom: string;
}

КАНДІДАТ

export class Candidat {
id: number;
nom: string;
agence: Agence;
}

Атрибути кандидата завантажуються з іншого компонента

Коли відображається розділ div, значення за замовчуванням agence.nom не встановлено

У когось є ідея? Дякую !!!

Відповіді:

2 для відповіді № 1

По-перше, select повинен мати name атрибут:

<select [(ngModel)]="candidat.agence" name="WHATEVER">

На підставі code показано, прив'язка повинна відбуватися автоматично ... може бути candidat.agence мав дещо властивість відрізняється від agence (від agences масив)

У всякому разі, щоб встановити candidat, ви можете зробити це:

ngOnInit(): void {
this.agenceService.getAgences().then(agences => this.agences = agences);

if (this.candidat && this.candidat.agence) {
this.candidat.agence = this.agences.find(agence => agence.name === this.candidat.agence.name);
}
}

---

0 для відповіді № 2

Знайдений потворний обхід:

ngOnChanges(): void {
if (this.candidat) {
for (let agence of this.agences) {
if (this.candidat.agence.nom == agence.nom) {
this.candidat.agence = agence;
}
}
}

Це встановлює агенцію кандидатури на об'єкт, визначений у списку

Чи є чистий спосіб зробити це?

---