html - Angular ve Typescript'te select seçeneğiyle dizi

Bir sayfada ilgili cevaplarıyla birlikte 51 soru gösteriyorum. Her iki bilgi de tek bir web servisi çağrısından geliyor.

<tbody>
   <tr *ngFor="let QuestionOption of questions; trackBy: trackQuestionById; let i = index;">
   <th scope="row">{{QuestionOption.id}}</th>
   <td>{{QuestionOption.name}} {{QuestionOption.description}}
    </p>
     <select  class="form-control"  name="selectAnswer" [(ngModel)]="answer[i]">
     <option *ngFor="let answers of QuestionOption.Answers" [ngValue]="answers.id">{{answers.description}}</option>
    </p>
   </td>
</tr>
</tbody>

TypeScript kodunda aşağıdakileri deniyorum:

answer: Answer[];
this.answer = new Array<Answer>();

Answer türünün Id, Name, Score, Description gibi birden fazla alanı vardır

Çalışmayan şey, her zaman Id'yi answer[i]'ye almam gerektiği ama id'yi answer[i].id alanında olmasını istemem.

Eğer değiştirirsem

[(ngModel)]="answer[i]"

içine

[(ngModel)]="answer[i].id"

Aşağıdaki istisnayı alıyorum: HATA TypeError: "_co.caaAnswer[_v.context.index] tanımsız"

Ben de denedim:

[(ngModel)]="answer[i]?.id"

Yani answer[i] kullanmak doğru mu? Ve sonra seçeneklerde seçilen değeri answer[i].id'ye bir şekilde atamalı mıyım? Eğer öyleyse, bunu nasıl yapacağımı birisi yardımcı olabilir mi.

Her türlü yardım takdir edilir! Çok teşekkürler. augeres

Cevap #1

Çözümü buldum. Sorun, compareWith fonksiyonunun Array yüzünden düzgün çalışmamasıydı. Sadece html select'i array indeksine göre adlandırırsanız çalışır:

Çalışan versiyon:

<select class="form-control" id="field_answer{{i}}" name="field_answer{{i}}" [(ngModel)]="resultAnswer[i].answer" [compareWith]="compareFn">
<option [ngValue]="answer" *ngFor="let answer of Question.answers; trackBy: trackAnswerById">{{answer.id}} {{answer.description}}</option>
</select> 

Cevap #2

Böyle bir seçim değişikliğinde cevaba yönelmek zorundasın

<select  class="form-control"  name="selectAnswer" [(ngModel)]="selectedAnswerId" (change)="setAnswer(i)">
 <option *ngFor="let answers of QuestionOption.Answers" [ngValue]="answers.id">{{answers.description}}</option>
<select>

component.ts içinde

selectedAnswerId : number;
setAnswer(index){
  this.answer[index].push({id : this.selectedAnswerId})
}