Давайте розглянемо кроки, щоб реалізувати нашу спеціальну структуру повідомлень перевірки:

  1. Налаштування директиви: додайте директиву ValidationMessagesDirective до свого проекту Angular.
  2. Створення повідомлень. …
  3. Інтеграція з елементами керування форми: застосуйте директиву до елементів керування формою, зв’язуючи вхідні повідомлення.

На стороні html ми групуємо всі прапорці під одним formGroupName, а потім призначаємо елементи керування formArray для прапорців. Тоді ми можемо перевірити, чи існує помилка *ngIf="Група форм?.

Як ви можете бачити в наведеному вище коді, ми додали спеціальне повідомлення про помилку за допомогою ModelState. Метод AddModelError(). Метод ValidationSummary() автоматично відображатиме всі повідомлення про помилки, додані в ModelState. Таким чином, ви можете використовуйте допоміжний метод ValidationSummary для відображення повідомлень про помилки.

Можуть відображатися повідомлення про помилки під полем форми підкресліть, додавши елементи mat-error всередині поля форми. Помилки спочатку приховані та відображатимуться в недійсних полях форми після взаємодії користувача з елементом або надсилання батьківської форми.

Щоб налаштувати спеціальний режим помилок, виконайте такі дії:

  1. Відкрийте файл web.config.
  2. Всередині <системи. web> змініть тег <customErrors> одним із таких способів: <customErrors mode="Off" /> <customErrors mode="RemoteOnly" /> <customErrors mode="On" />
  3. Збережіть і закрийте Інтернет. конфігурація.