Javascript 所选下拉列表值应在立即列值中更新

必须选择下拉列表，并且所选下拉列表值应在表中的立即列（td）值中更新。我尝试了下面的代码，我可以填充下拉列表，我可以从下拉列表中选择选项。但选定的下拉列表需要在即时“td”列中更新。请在附件中找到演示的屏幕截图和stackblitz

HTML代码：

 <select [disabled]="!person.check?true:null" [(ngModel)]="person.test" (change)="selected(person.test)">  
      <option *ngFor="let prod of ProductHeader" [value]="prod.name" >{{prod.name}}</option>

---

该列似乎指向firstName，而不是您在下拉列表中绑定的测试。。因此，您可能希望将其更改为

{{person.test}

例如：

    <tbody>
      <tr *ngFor="let person of persons;let i = index;">
        <td><input [(ngModel)]="person.check" type="checkbox" class="checkboxCls" name="id" ></td>
        <td>{{ person.id }}</td>
        <td>
          <span id={{i+1}})>{{ person.firstName }}</span><br/>
          <select [disabled]="!person.check?true:null" [(ngModel)]="person.test" (change)="selected(person.test)">
            <option *ngFor="let prod of ProductHeader" [value]="prod.name" >{{prod.name}}</option>
          </select>
        </td>
        <td>{{ person.test }}</td>    <---HERE
        <td>{{ person.firstName }}</td>
        <td>{{ person.lastName }}</td>
      </tr>
    </tbody>

{{person.id}
{{person.firstName}}

{{prod.name}
{{person.test}（{…x，check:false，test:x.firstName}））

    <tbody>
      <tr *ngFor="let person of persons;let i = index;">
        <td><input [(ngModel)]="person.check" type="checkbox" class="checkboxCls" name="id" ></td>
        <td>{{ person.id }}</td>
        <td>
          <span id={{i+1}})>{{ person.firstName }}</span><br/>
          <select [disabled]="!person.check?true:null" [(ngModel)]="person.test" (change)="selected(person.test)">
            <option *ngFor="let prod of ProductHeader" [value]="prod.name" >{{prod.name}}</option>
          </select>
        </td>
        <td>{{ person.test }}</td>    <---HERE
        <td>{{ person.firstName }}</td>
        <td>{{ person.lastName }}</td>
      </tr>
    </tbody>