Массив с опцией выбора в Angular и Typescript

Question

Я отображаю 51 вопрос с соответствующими ответами на странице.Обе данные поступают с одного вызова веб-службы.

<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>

на машинописном коде я пытаюсь сделать следующее:

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

Тип ответа имеет несколько полей, таких как: Id, Имя, Счет, Описание

Что такоене работает то, что у меня всегда есть идентификатор в ответе [i], но я хочу иметь идентификатор в поле answer [i] .id

Если я изменю

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

в

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

Я получаю следующее исключение: ОШИБКА TypeError: "_co.caaAnswer [_v.context.index] не определено"

Я также пробовал:

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

Так правильно ли использовать ответ [i]?а затем в опции я должен как-то назначить answer [i] .id выбранное значение.Если так, то кто-нибудь может помочь, как это сделать.

Любая помощь приветствуется!Большое спасибо.augeres

Answer 1

Я нашел решение.Проблема заключалась в том, что функция CompareWith не работала должным образом из-за массива.Это работает только в том случае, если вы назовете html select на основе индекса массива:

Рабочая версия:

<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> 

Answer 2

Вы должны нажать на ответ при выбранном изменении, как это

<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

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