[英]FormControlName must be used with a parent FormGroup directive when FormGroup is passed to child component
Parent Component父组件
<form [formGroup]="User">
<app-radioButton [group]="user"></app-radiobuton>
</form>
In Radio Component html在无线电组件 html
<mat-radio-button [formControlName]="name" > <mat-radio-button>
in.ts of Radio component无线电组件的 in.ts
export class RadioComponent{
@Input() group: FormGroup;
}
Giving error as above.如上给出错误。 Not sure what wrong am i doing.
不知道我在做什么错。
The reason why its failing its because Angular is waiting for FormGroupDirective on any of parent - child elements.之所以失败,是因为 Angular 正在等待任何父子元素上的 FormGroupDirective。 So:
所以:
In child component please declare:在子组件中请声明:
@Component({
selector: 'child',
templateUrl: './child.component.html',
viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }]
})
OR或者
You can use formControl in the child component:您可以在子组件中使用 formControl:
<mat-radio-button [formControl]="name" > <mat-radio-button>
In your code there is [formGroup]="User"
and you pass to child component [group]="user"
.在您的代码中有
[formGroup]="User"
并传递给子组件[group]="user"
。 Why there is different data provided: User
and user
?为什么提供不同的数据:
User
和user
?
If you want to use your FormGroup
the way as you done, - just make your form group wrapping for a child control in the child component too:如果您想按照您的方式使用您的
FormGroup
,只需将您的表单组包装为子组件中的子控件:
<ng-container [formGroup]="group">
<mat-radio-button [formControlName]="name"><mat-radio-button>
</ng-container>
The other way is to make a more proper component structure:另一种方法是制作更合适的组件结构:
<form [formGroup]="User">
<app-radioButton [formControlName]="name"></app-radiobuton>
</form>
And inject control in the child component.并在子组件中注入控制。 You can check how to do it here
您可以在此处查看如何操作
The main reason behind it that you are using a form control field which is out side of the form tag背后的主要原因是您使用的是表单标签之外的表单控制字段
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.