Angular2 ngNoForm и также выполняет проверку угловой формы

#angular #angular2-forms

#angular #angular2-формы

Вопрос:

У меня есть устаревший серверный сервер, который обрабатывает данные формы в качестве параметров запроса. Мы помещаем angular2 на передний план. Я хочу отправить форму angular2, чтобы все поля отображались как параметры запроса, чтобы не нужно было изменять устаревший серверный интерфейс. Для этого у меня есть :

 <form  ngNoForm action="http://localhost/config/api/v1/angular/submit" target="_blank" method="POST">

Но я также хочу использовать проверку формы angular2 на кнопке отправки:

 <form #f="ngForm" ngNoForm action="http://localhost/config/api/v1/angular/submit" target="_blank" method="POST">
 <button type="submit" [disabled]="!f.form.valid" class="small round">Submit</button>

Однако это не работает — angular2 жалуется на наличие #f=»ngForm» при объявлении ngNoForm.

Есть ли какой-либо способ выполнить проверку формы angular2 как обычно, а также отправить форму в качестве обычных параметров запроса?

1. Для достижения этой цели я использую ReactiveForms вместе с AJAX-запросом. У меня нет опыта использования ngNoForm . Я добавляю параметры своего запроса в массив строк, соединяю их как arr.join('amp;') и кодирую encodeURI(body) . Это определенно нечто большее, чем это, но в этом суть организации данных формы. В вашем TS. Если это то, что вы можете сделать с вашим устаревшим приложением, я могу опубликовать более подробный ответ.

2. К сожалению, поскольку вся форма управляется метаданными, я не имею представления о том, какие поля находятся на странице. Думаю, я мог бы выяснить, какие поля находятся на странице, используя javascript, а затем реализовать упомянутое вами решение. Спасибо.

Ответ №1:

Принудительная отправка с использованием чистого JS, это сработало для меня:

 <form ngNoForm [formGroup]="myForm" action="http://test.local/process_post.php" target="_blank" method="POST">
    <input formControlName="alpha" name="alpha"/>
    <input formControlName="beta" name="beta"/>
    <button type="submit" [disabled]="!myForm.valid" onclick="submit()">SEND</button>
</form>

1. Я не хочу использовать FormGroup, т.Е. Я хочу использовать [ngModel] способ привязки, поскольку моя форма очень динамична на основе данных, отправляемых сервером, и для нас хорошо подходят только формы, управляемые шаблоном, т.е. использование ngModel.

2. можно ли использовать кнопку вне тегов формы для отправки с помощью ngNoForm