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

您必须像这样在[(ngModel)]中使用html。

<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>

无法将形式与输入离子结合

2 个答案: