编辑填写的表格并使用 Ionic/Angular 重新提交答案

【问题标题】：Edit a filled form and resubmit it with Ionic/Angular编辑填写的表格并使用 Ionic/Angular 重新提交
【发布时间】：2021-10-13 17:46:24
【问题描述】：

我在 Ionic 移动应用程序上工作。
我有一个显示数据的表单（该数据来自网络服务）。是否可以编辑该表单然后提交以进行更改？
我尝试这样做，但没有设法编辑预填充字段（例如删除一个字母或单词，添加一些字符..），就好像该版本已被禁用一样。

这是 HTML 部分（文本区域的示例）：

<ion-list>
  
  <ion-item>
    <ion-label >Text area example</ion-label>
    <!-- com field comes from a webservice-->
    <ion-textarea  [(ngModel)]="editcom">{{com}}</ion-textarea>&nbsp;
  </ion-item>  
  
    <ion-button color="danger" (click)="editForm()" expand="block">OK</ion-button>

</ion-list>

这里是 TS 部分：

editForm(){
      console.log(this.editcom);
      this.service.postObjets(this.editcom); // send Data to Database
  }

我使用该 sn-p 从 GIS WMS Web 服务获取数据：

  let promise =   this.http.get(WMS_Webservice_URL).toPromise();
  await promise
  .then((data)=>{
    var com = (data['features'][0]['properties']['com']);
    this.com = com;
  })
  .catch((error)=>{
    this.com = '';
  });

任何帮助将不胜感激，谢谢

【问题讨论】：

你能发布你从服务器获取数据的函数吗？
好了，搞定了！
我建议你尝试使用 FormControl/FormGroup。
使用双向绑定的 ngmodel 时，不需要使用插值。删除 {{com}} 并更改 [(ngModel)]="com"。现在对 textarea 的任何更改都将在 com 上生效
非常感谢@Qiimiia，我的错我忘了使用双向绑定..我做了修改，它完美地工作。太好了！

标签： android node.js angular typescript ionic-framework

【解决方案1】：

当您使用双向绑定时，您不需要使用插值。删除{{com}} 并更改[(ngModel)]="com"。现在 textarea 中的任何更改都将在com 上生效。你不再需要editcom。

【讨论】：