Angular 5:在Modal ng-template验证中包含表单的组件

import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';

@Component({
  selector: 'app-modal-component',
  templateUrl: './modal-component.component.html',
  styleUrls: ['./modal-component.component.css']
})
export class ModalComponentComponent implements OnInit {
  modalForm: FormGroup;

  constructor(private formBuilder: FormBuilder) { }

  ngOnInit() {
    this.modalForm = this.formBuilder.group({
      name: ['', Validators.required],
      email: ['', [Validators.required, Validators.email]],
      password: ['', [Validators.required, Validators.minLength(6)]]
    });
  }

  // 其他组件逻辑和方法
}

<ng-template #modalContent let-modal>
  <div class="modal-header">
    <h4 class="modal-title">Modal Title</h4>
  </div>
  <div class="modal-body">
    <form [formGroup]="modalForm">
      <div class="form-group">
        <label for="name">Name</label>
        <input type="text" class="form-control" id="name" formControlName="name">
      </div>
      <div class="form-group">
        <label for="email">Email</label>
        <input type="email" class="form-control" id="email" formControlName="email">
      </div>
      <div class="form-group">
        <label for="password">Password</label>
        <input type="password" class="form-control" id="password" formControlName="password">
      </div>
    </form>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-primary" (click)="save(modalForm)">Save</button>
    <button type="button" class="btn btn-secondary" (click)="cancel()">Cancel</button>
  </div>
</ng-template>

save(form: FormGroup) {
  if (form.valid) {
    // 执行保存逻辑
  } else {
    // 显示错误消息或执行其他操作
  }
}

cancel() {
  // 执行取消逻辑
}