無法將形式與輸入離子結合

Question

我想用離子HTML模板綁定我的動態輸入字段。

home.html的

    <form [formGroup]="clientForm">
     <ion-item *ngFor="let obj of clientForm.controls.assign_array.controls;let z=index">
            <ion-input placeholder="Type dat" type="text"></ion-input>
          </ion-item>
    </form>

home.ts

constructor(){
 this.clientForm = this._fb.group({
   assign_array: this._fb.array([])
 });
}

在保存時單擊：

btnClick(){
    console.log("clintform--- " + JSON.stringify(this.clientForm.value));
}

輸出： {“ assign_array”：[“”，“”，“”]}

我可以在我的應用程序中看到多個輸入字段，但是當我在每個字段中鍵入內容時，我的日志不會顯示assign_array字段的值

我在哪里犯錯？

先感謝您！

Answer 1

您只需要像這樣在html使用[(ngModel)] 。

<ion-input placeholder="Type dat" type="text" [(ngModel)]="inputFieldValue"></ion-input>

並在.ts文件中

public inputFieldValue;
console.log("--------inputFieldValue-------",inputFieldValue)

希望這可以幫助您。

Answer 2

您需要為輸入標記一個formControlName ，因為您需要字符串值，因此可以僅使用索引作為formcontrolname，它是從迭代中獲得的：

<form [formGroup]="clientForm">
  <ion-item *ngFor="let obj of clientForm.get('assign_array').controls; let z=index">
    <ion-input [formControlName]="z" placeholder="Type dat" type="text"></ion-input>
  </ion-item>
</form>