Angular 7 Реактивная кнопка отправки формы управления - PullRequest
Новая
       13

Angular 7 Реактивная кнопка отправки формы управления

0 голосов
/ 25 января 2019

Я работаю над веб-страницей.На одной из страниц будет какой-то математический тест.Хорошо, я мог бы создать страницу с шаблонно-управляемыми формами и проверкой, но я хочу кое-что узнать о создании этой страницы, поэтому я принял реактивные формы.Моя проверка работает до сих пор: - кнопки отключены до тех пор, пока я не введу правильные числа - будет отображаться ошибка

Одна из моих проблем с Хью - отключение кнопки работает неправильно.Если я сделаю правильный ввод в одном из полей и неверный ввод в другом, обе кнопки будут отключены, или я могу нажать кнопку с неправильным вводом, и моя страница вылетит.

Можно ли отделитьпроверка ввода и валидация кнопки с одной реактивной формой?Это облегчит задачу, если я добавлю больше тестов.

Я пытался получить подтверждение в моем шаблоне с .... value.valid для каждой кнопки, но это не сработает

Мой кодon:

https://stackblitz.com/edit/angular-5cgyyg?file=src%2Fapp%2Fapp.module.ts

Я сделал небольшое изменение в кнопке 2: 

<button mat-raised-button color="primary" type="submit"
                [disabled]="primForm.pristine || primForm.invalid || primForm.value.zahl === '' || primForm.value.jahr !== ''"
                class="btn btn-success">
          Zerlegen
        </button>

И второй: 

<button mat-raised-button color="primary" type="submit"
              [disabled]="primForm.pristine || primForm.invalid || primForm.value.jahr === '' || primForm.value.zahl !==''"
              class="btn btn-success">Prüfen
      </button>

Сейчасобе кнопки отключены, когда оба поля ввода имеют содержимое.

Одна вещь, все еще в поисках более элегантного способа ее решения.

Возможно, у кого-то есть идея для этого.

Заранее спасибо

...