在ngFor中选择标签 - ngModel不会根据值进行选择

Question

选择内部的下拉列表不是基于ngModel预先选择值。 这是相关的组件和HTML代码：

testArr = [
    {
        id : '1',
        value: 'one'
    },
    {
        id : '2',
        value: 'two'
    },
    {
        id : '3',
        value: 'three'
    },
    {
        id : '4',
        value: 'four'
    }
];

testVal = [
    {
        id : '3',
        value : 'three'
    },
    {
        id : '4',
        value : 'four'
    },
    {
        id : '2',
        value : 'two'
    },
];

<tr *ngFor="let t of testVal">
    <select name = "test" [(ngModel)] = "t.id">
        <option *ngFor="let x of testArr" [ngValue]="x.id">
            {{ x.value }}
        </option>
    </select>
</tr>

此预先选择下拉列值为：

但是，下拉列表的值应预先选择：

Answer 1

当您为所有输入使用相同的名称时，它会导致问题

使用ngFor index，然后为select输入创建动态名称，如：

<tr *ngFor="let t of testVal;let i = index;">
    <select name = "test{{i}}" [(ngModel)] = "t.id">

WORKING DEMO

（您可以在浏览器中测试它，因为它将在最新的chrome和firefox中使用相同的输入名称）