如何将ngForm传递给子组件？

import { Component } from '@angular/core';
import { NgForm } from '@angular/forms';

@Component({
  selector: 'app-parent',
  template: `
    <form #parentForm="ngForm" (ngSubmit)="onSubmit(parentForm)">
      <app-child [childForm]="parentForm"></app-child>
      <button type="submit">Submit</button>
    </form>
  `
})
export class ParentComponent {
  onSubmit(form: NgForm) {
    console.log(form.value);
  }
}

import { Component, Input } from '@angular/core';
import { NgForm } from '@angular/forms';

@Component({
  selector: 'app-child',
  template: `
    <input type="text" name="childInput" formControlName="childInput" />
  `
})
export class ChildComponent {
  @Input() childForm: NgForm;
}

import { Component, ViewChild } from '@angular/core';
import { NgForm } from '@angular/forms';
import { ChildComponent } from './child.component';

@Component({
  selector: 'app-parent',
  template: `
    <form #parentForm="ngForm" (ngSubmit)="onSubmit(parentForm)">
      <app-child></app-child>
      <button type="submit">Submit</button>
    </form>
  `
})
export class ParentComponent implements AfterViewInit {
  @ViewChild(ChildComponent) childComponent: ChildComponent;

  ngAfterViewInit() {
    this.childComponent.childForm = this.form;
  }

  form = new NgForm({});

  onSubmit(form: NgForm) {
    console.log(form.value);
  }
}

import { Component, Input } from '@angular/core';
import { NgForm } from '@angular/forms';

@Component({
  selector: 'app-child',
  template: `
    <input type="text" name="childInput" formControlName="childInput" />
  `
})
export class ChildComponent {
  @Input() childForm: NgForm;
}