有没有办法使用另一个组件中的表单？答案

【问题标题】：Is there a way to use a form from a component in another?有没有办法使用另一个组件中的表单？
【发布时间】：2019-08-20 20:47:35
【问题描述】：

我有一个组件，我想显示一些表单，每个表单都来自不同的组件。（每个选项卡都是来自组件的一个表单）。

它基本上是一个只有选项卡和表单空间的组件。

并在各自的选项卡中显示 6 个表单组件。

我尝试只在组件上添加组件选择器，但它无法识别表单生成器。

这是表单组件：

export class EnderecoFormComponent extends BaseFormComponent implements OnInit {
  @ViewChild('nro') nro: ElementRef;
  uf: SelectItem[];

  constructor(private formBuilder: FormBuilder,
    private http: HttpClient,
    private dropdownService: DropdownService,
    private cepService: ConsultaCepService,
    private renderer: Renderer) {
    super();
  }

  ngOnInit() {

    this.uf = [
      { label: 'SP', value: 'SP' }
    ];

    this.formulario = this.formBuilder.group({
      id: [''],
      municipio: ['', Validators.required],
      cep: ['', Validators.required],
      uf: ['', Validators.required],
      cidade: ['', Validators.required],
      bairro: ['', Validators.required],
      logradouro: ['', Validators.required],
      numero: ['', Validators.required],
      complemento: ['']
    });
  }

这是我试图从其他组件显示表单的组件模板：

<section id="endereco" class="tab-panel">
               <app-endereco-form>
               </app-endereco-form>
</section>

问题是：我想创建一个提交按钮来提交来自不同组件的所有表单。

从我正在显示表单的组件中，我无法访问表单的 formBuilders，因为它们来自另一个组件。

有没有办法从其他组件访问 formBuilder？

谢谢。 :)

【问题讨论】：

标签： angular frontend angular7

【解决方案1】：

您可以将表单作为@Input() 属性传递。

<child-component [form]="formulario">

在 child.component.ts 中获取“form”属性

@Input() form: FormGroup

这里有非常相似的问题 Pass Angular Reactive FormControls to Children Components

【讨论】：

【解决方案2】：

您可能还想将表单组添加到根目录中提供的服务中。

【讨论】：