Question

我正在开发一个表单，但我需要显示与内容不同的内容。

我得到了：

<ion-label>Rate</ion-label>
     <ion-input text-right detail-push formControlName="rate" type="text"
          placeholder="00.00"
          [(ngModel)]="rateDisplay" disabled>
     </ion-input>

然后我像这样访问我的表单：

if(!this.clientAction.isRateFormEmpty()){
  this.clientForm.controls['rate'].setValue(this.clientAction.getRateForm());
  this.rateDisplay = this.clientAction.getRateFormToDisplay();
}

思考来自 getRateForm（）我收到一个对象，并在表单上显示[Object Object]，我明白这是正常的，因为这是我的价值，它需要成为一个对象，因为我需要稍后在我的提交方法上发送此对象。

但是使用 getRateFormToDisplay（），我会收到一个我想在输入中显示的字符串。

有可能吗？

Answer 1

好的，所以我终于找到了解决方案。

我创建了第二个输入“hidden”，其中我放置了 getRateForm（）

的返回

然后在第二个输入上，我显示了 getRateFormToDisplay（）的返回，但我“禁用”了这个输入，所以我没有从表单中获取数据。

<ion-input text-right detail-push 
   formControlName="rate" 
   type="text" 
   hidden>
</ion-input>
<ion-input text-right detail-push 
   formControlName="rateDisplay" type="text"
   placeholder="00.00"
   [(ngModel)]="rateDisplay">
</ion-input>

在我的打字稿文件中：

this.clientForm = this.formBuilder.group({
  rate: [this.rateForm],
  rateDisplay: [{value: '00:00', disabled: true}],
});

也许有一天它会帮助你们中的一个。

Angular 2表单控件，显示名称和值不同

1 个答案: