Angular: Форма: страница перезагружается при удалении / восстановлении NgForm через NgIf

Созданный на 1 февр. 2016 · 3Комментарии · Источник: angular/angular

Странно, но возникло невинно.

Пытался реализовать (отсутствующую) функцию сброса формы путем переключения предыдущей формы из DOM и обратно с NgIf, закрепленным на флаге active

<form *ngIf="active" 
          (ngSubmit)="onSubmit()" #heroForm="ngForm">

контролируется методом компонента clear подобным этому

  clear() {
    this.model = new Hero(42, '', '');
    this.active = false;
    setTimeout(()=> this.active=true, 0);
  }

Если форма действительна (как в начале), нажатие кнопки «Очистить» вызывает перезагрузку страницы. Если форма недействительна (например, без имени), перезагрузки не происходит.

Вот репродукция через плункер:
http://plnkr.co/edit/GNhLbONEDHyApCm9vUeh

Источник

wardbell

👍1

Самый полезный комментарий

Кнопка очистки имеет тип «отправить». Таким образом, нажатие на нее вызывает отправку формы. Предполагается, что NgForm перехватывает событие отправки, но поскольку NgIf удаляет элемент формы из DOM, перехвата не происходит. Вы можете исправить это, установив тип кнопки «кнопка».

vsavkin 1 февр. 2016

👍2 🎉1

Все 3 Комментарий

vsavkin 1 февр. 2016

👍2 🎉1

Спасибо. Я не знал, что <button> _ без атрибута типа _ - это то же самое, что и кнопка отправки!
Это решает проблему, как видно из этого обновленного плункера: http://plnkr.co/edit/u3ltLP84JHn2VkoFKf46?p=preview

Закрытие этой проблемы и открытие # 6822, которое требует явной функции reset для замены взлома, проиллюстрированного этим плункером.

wardbell 1 февр. 2016

👍1

Эта проблема была автоматически заблокирована из-за бездействия.
Сообщите о новой проблеме, если вы столкнулись с аналогичной или связанной проблемой.

Узнайте больше о нашей политике автоматической блокировки разговоров .

_{_Это действие было выполнено автоматически ботом. _}