вложенные формы: нет подтверждения внутренней формы при отправке

Question

У меня есть шаблон с несколькими формами. Форма А находится внутри формы В. Когда я нажимаю кнопку отправки формы B, я не хочу проверять форму A. Форма A должна быть подтверждена собственной кнопкой отправки.

<form #formB="ngForm">
    <input name="input_one" />
    <form #formA="ngForm"
        <input name="input_two" />
        <button type="submit"></button>
    </form>
    <button type="submit></button>
</form>

Спасибо за ваши ответы.

С наилучшими пожеланиями

Answer 1

HTML-формы не могут быть вложены, см. Можете ли вы вкладывать HTML-формы? .

вы можете использовать Angular FormGroup для желаемой функциональности. см

• https://angular.io/api/forms/NgModelGroup
• Angular 2: Добавить валидаторы в ngModelGroup

Я сделал очень простой пример -> https://stackblitz.com/edit/angular-zuzzy1

Если вы нажмете на кнопку с меткой «group1», она отобразит действительность только всего, что находится внутри группы форм group 1

Если вы хотите отправить группы содержимого / значений самостоятельно, вам нужно реализовать это самостоятельно (то есть добавить обычную кнопку, получить значения группы форм и отправить ее вручную)

Но обычно у вас есть одна модель для одной формы, и вы отправляете форму целиком.

Надеюсь, что это отвечает на вопрос.

ОБНОВЛЕНИЕ после комментариев

см. -> https://stackblitz.com/edit/angular-djks4d?file=src%2Fapp%2Fapp.component.html

если вы нажмете кнопку form B, она всегда должна выдавать предупреждение true независимо от состояния подкомпонента / подформы.

У стекаблица есть две возможности.

• сгенерируйте ваши данные в другом компоненте (hello.component и отправьте сгенерированные данные на app.component через EventEmitter
• просто используйте другую форму внутри формы B (обратите внимание, что я не использовал тег <form>, потому что он не будет действительным html согласно спецификации)

Другой возможностью было бы вообще не создавать форму для создания данных и обрабатывать все вручную (например, в событии keyup или подобном)

Лично я бы, вероятно, выбрал вариант 1 (компонент), потому что он правильно отделен и многократно используется.

Но оба работают.