Question

您好，我是Angular的新人。我这里有一个表单组，我想在左侧的选择下拉菜单中显示正在选择的产品的价格。我需要获取所选项目的价格，以便我可以将其乘以数量字段以获得总价格。您的建议非常感谢。感谢。

<td><select class="form-control" formControlName="firstItem">                                
                      <option *ngFor="let item of list" [value]='item.name' selected>
                       {{item.name}}
                      </option>
                  </select></td>  
          <td><input type="text" class="form-control" readonly [value]="applyForm.get('firstItem').value"></td>              
          <td><input type="number" class="form-control"  min="0" max="1000" formControlName="firstQty"></td>
          <td><input type="text" class="form-control" readonly value="" formControlName="firstTotal"></td>



 private list = [
{ price: 205, name: 'NLIGHTEN Premium Soap' },
{ price: 205, name: 'NLIGHTEN Kojic Papaya with Glutathione' },
{ price: 550, name: 'NLIGHTEN Facial Cleanser' }];

Answer 1

将模板更改为此

<td>
 <select class="form-control" formControlName="firstItem">                                
  <option *ngFor="let item of list" [value]="item.price" selected>
   {{item.name}}
  </option>
 </select>
</td>  
<td>
 <input type="text" class="form-control" readonly [value]="applyForm.get('firstItem').value">
</td>              
<td>
 <input type="number" class="form-control"  min="0" max="1000" formControlName="firstQty">
</td>
<td>
 <input type="text" class="form-control" readonly value="" formControlName="firstTotal">
</td>

我更改了[value]="item.price"中的options。（使用双引号"代替'，并分配给item.price）。

选择项目并在Angular 4的输入字段中显示价格

1 个答案: