Angular 2 - ngModel with dynamic object/properties
<p>In my TS file I am dynamically creating the properties on my <code>selectedValsObj</code> object like this:</p>

<pre><code>private selectValsObj: any = {};

setSelectedValsObj(sectionsArr) {
  sectionsArr.forEach(section =&gt; {
    section.questions.forEach(questionObj =&gt; {
      if (questionObj.type === 'drop-down') {
        this.selectValsObj[questionObj.questionId] = { selected: questionObj.answerDetails[0] };
      }
    })
  });
}
</code></pre>

<p>In my HTML I want to bind the <code>[ngModel]</code> on my inputs to the properties on the <code>selectValsObj</code> object.  I have tried this but have had no luck: </p>

<pre><code>&lt;div *ngFor="let question of section.questions"&gt;
    &lt;div class="drop-down-question" *ngIf="question?.type === 'drop-down'"&gt;
        &lt;select class="q-select"
                [(ngModel)]="selectValsObj[questionId].selected" // &lt;== doesnt work either**
                // [(ngModel)]="selectValsObj[{{ questionId }}].selected" // &lt;== doesnt work**
                name="answerForQuestion{{ question?.questionId }}"&gt;
            &lt;option *ngFor="let answer of question?.answerDetails"
                [ngValue]="answer"&gt;
                    {{ answer?.value }}
            &lt;/option&gt;
        &lt;/select&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>How can I set the <code>ngModel</code> in my HTML to a dynamically created property in my TS file?</p>