根据使用formControlName-ReactiveForms选择的下拉菜单设置输入的值

问题描述

我有一个输入，该输入的值应基于所选的下拉菜单.这是我的代码

I have an input whose value should be based on dropdown selected. here is my code

<div class="col-sm-9">
  <nb-select type="number" fullWidth id="service" formControlName="service">
      <nb-option *ngFor="let service of Services" [value]="service">{{service.name}} </nb-option>
  </nb-select>
</div>

<input type="number value="service.price">

我的.ts文件

Services: Array<any>=[
    {name: 'Consultation', price: 100},
    {name: 'Follow Up', price: 200},
    {name: '24 Hrs. Creatinine', price: 300},
    {name: 'Complete Blood Count - CBC', price: 400},
    {name: 'X-Ray', price: 500}];

因此，选择咨询"时，输入值应为100.类似地，选择"X射线"时，输入值应设置为500.

So when Consultation is selected, input value should be 100. Similarly when X-ray is selected, input value should be set to 500.

我只想使用formControl. ngModel不是必需的.帮我如何做到这一点

I want to use formControl only. ngModel is not required.Help me how can i acheive this

推荐答案

尝试一下

<input type="number" value="{{form.controls['service'].value.price}}" />

我认为您的表单组是表单"

I assume your formgroup is "form"

<form [formGroup]="form">

这篇关于根据使用formControlName-ReactiveForms选择的下拉菜单设置输入的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！