Как проверить валидность формы(дочерний элемент) в родительском эелементе?

Для проверки валидности формы в дочернем элементе из родительского элемента в Angular, можно использовать следующий подход.

1. Назначьте дыхательное отверстие (output) из дочернего элемента, чтобы оповестить родительский элемент о валидности формы. Для этого в дочернем элементе добавьте Output декоратор к сигнатуре класса и определите событие, которое будет вызываться, когда валидность формы изменяется. Например:

import { Component, Output, EventEmitter } from '@angular/core';

@Component({
  selector: 'app-child',
  template: '...',
})
export class ChildComponent {
  @Output() formValidityChanged: EventEmitter<boolean> = new EventEmitter<boolean>();

  // ... код компонента ...
}

2. В дочернем элементе следите за изменениями валидности формы. Для этого добавьте обработчик события валидности формы и вызовите событие formValidityChanged, чтобы оповестить родительский элемент о изменении валидности формы. Например:

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

@Component({
  selector: 'app-child',
  template: '...',
})
export class ChildComponent {
  @Output() formValidityChanged: EventEmitter<boolean> = new EventEmitter<boolean>();
  form: FormGroup;

  constructor(private formBuilder: FormBuilder) {
    this.form = this.formBuilder.group({
      // ... определение полей формы ...
    });

    this.form.valueChanges.subscribe(() => {
      this.formValidityChanged.emit(this.form.valid);
    });
  }

  // ... код компонента ...
}

3. В родительском элементе определите обработчик события и проверьте валидность формы. Привяжите этот обработчик к событию formValidityChanged дочернего элемента. Например:

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

@Component({
  selector: 'app-parent',
  template: '<app-child (formValidityChanged)="onFormValidityChanged($event)"></app-child>',
})
export class ParentComponent {
  isFormValid: boolean = false;

  onFormValidityChanged(isValid: boolean): void {
    this.isFormValid = isValid;
    // ... код для выполнения при изменении валидности формы ...
  }

  // ... код компонента ...
}

Теперь, когда дочерний элемент отправляет событие formValidityChanged, родительский элемент получает это событие через привязку и может обработать его, обновив значение isFormValid, или выполнив другую логику, зависящую от валидности формы.

Надеюсь, это поможет вам проверить валидность формы в дочернем элементе из родительского элемента в Angular! Если у вас возникнут дополнительные вопросы, не стесняйтесь задавать.