Question

我有这个数组我试图在我的模板中显示，不知何故它将无法正确显示。如果我做[值]它会给我正确的值但是ofc。不绑定数组和值。

阵列：

{"pluNo":1,"pluName":"Smirnoff 2cl","pluDepartment":"VODKA","pluPrice":2000},
{"pluNo":2,"pluName":"Smirnoff 4cl lala","pluDepartment":"VODKA","pluPrice":4000},
{"pluNo":3,"pluName":"Jack D 2cl","pluDepartment":"Whiskey","pluPrice":2200},
{"pluNo":4,"pluName":"Smirnoff 4cl","pluDepartment":"VODKA","pluPrice":4000},
{"pluNo":5,"pluName":"Rom","pluDepartment":"Rom","pluPrice":2500},
{"pluNo":6,"pluName":"Rom 4cl","pluDepartment":"Rom","pluPrice":5000}

这是我的表格，PLU号码正确打印，只有其他字段都设置为我列表的最后一项。

<tbody>
    <tr *ngFor="let item of products; let i = index">
        <td scope="row">
            {{item.pluNo}}                                                                          
        </td>
        <td>
            <input type="text" [(ngModel)]="item.pluName" name="plu" class="form-control m-input" placeholder="" value="">                                                                  
        </td>
        <td>
            <input type="text" [(ngModel)]="item.pluDepartment" name="pluDepartment" class="form-control m-input" placeholder="" value="">                                                          
        </td>
        <td>
            <input type="number" [(ngModel)]="item.pluPrice" name="pluPrice" class="form-control m-input" placeholder="">                                                                   
        </td>   
        <td>
            <button (click)="deletePluItem(item)">Delete</button>
        </td>
    </tr>
</tbody>

Answer 1

您需要做的就是为所有name提供不同的inputs

将name="plu"更改为name="plu{{i}}"

然后检查，您将了解该问题，然后对所有输入进行更改。

ngModel始终将最后一项复制到表中的所有字段

1 个答案: