您可以像这样将整个表格传递给您的孩子:
parents.html
<form [formGroup]="myGroup">
<app-window-element [parentform]="myGroup"></app-window-element>
</form>
我具有以下结构:
父组件(对话)
<form #dialogForm="ngForm">
<app-window-element></app-window-element>
</form>
<button (click)="button.callback(dialogForm)">Click me</button>
子组件(元素)] >>
<div>
<label for="email">Email</label>
<input type="text" name="email" id="email" formControlName="email">
<label for="password">Password</label>
<input type="password" name="password" id="password" formControlName="password">
</div>
并且当单击按钮时-发送#dialogForm
。但是我有问题-对象dialogForm
没有子组件的字段。 (dialogForm是NgForm)我收到错误:
WindowFormComponent.html:5错误错误:必须使用formControlName与父formGroup指令。您将要添加一个formGroup指令并将其传递给现有的FormGroup实例(您可以在您的类中创建一个实例)。
示例:
<div [formGroup]="myGroup"> <input formControlName="firstName"> </div> In your class: this.myGroup = new FormGroup({ firstName: new FormControl() });
如果我在表单中只有字段-这是可行的,但不适用于子组件。
<form #dialogForm="ngForm">
<label for="email">Email</label>
<input type="text" name="email" id="email" formControlName="email">
<label for="password">Password</label>
<input type="password" name="password" id="password" formControlName="password">
</form>
<button (click)="button.callback(dialogForm)">Click me</button>
我具有以下结构:父组件(对话框)
您可以像这样将整个表格传递给您的孩子:
parents.html
<form [formGroup]="myGroup">
<app-window-element [parentform]="myGroup"></app-window-element>
</form>
child.ts
@Input() parentForm: FormGroup;
child.html
<div [formGroup]="parentForm">
<label for="email">Email</label>
<input type="text" name="email" id="email" formControlName="email">
<label for="password">Password</label>
<input type="password" name="password" id="password" formControlName="password">
</div>
您可以像这样将整个表格传递给您的孩子:
parents.html
<form [formGroup]="myGroup">
<app-window-element [parentform]="myGroup"></app-window-element>
</form>