Как очистить / сбросить неверный ввод в целочисленных полях ввода в угловой дротик? - PullRequest
Новая
       13

Как очистить / сбросить неверный ввод в целочисленных полях ввода в угловой дротик?

0 голосов
/ 21 сентября 2018

Я новичок в угловом дротике.Недавно я начал разрабатывать веб-приложение, которое позволяет пользователю редактировать и перечислять пользовательские данные.Я использовал «ngForm» для создания форм и материалов, чтобы получить входные данные от пользователя.Я использую «ngModel» для привязки данных.
У меня есть кнопка «Очистить» в форме, которая очищает все поля формы, вызывая form.reset ().Однако это не очищает поле, в котором есть неверный ввод.У меня есть поле ввода (возраст) типа «число».Когда пользователь вводит в нее строку и нажимает кнопку очистки, ввод не очищается.
Вот код: 

<div>
  <div *ngIf="user != null">
    <h2>{{user.name}}</h2>
    <div>
      <form #editUserForm="ngForm">
        <material-input [(ngModel)]="user.name"
                        ngControl="userName"
                        #userNameInput="ngForm"
                        label="user name" type="text"
                        error="{{getError('name')}}"
                        required>
        </material-input>
        <material-input [(ngModel)]="user.age"
                        ngControl="age"
                        #ageInput="ngForm"
                        label="age"
                        type="number"
                        error="{{getError('age')}}"
                        required>
        </material-input>
        <material-input [(ngModel)]="user.emailId"
                        ngControl="emailId"
                        #emailIdInput="ngForm"
                        label="email id"
                        type="text"
                        error="{{getError('email_id')}}"
                        required>
        </material-input>
        <div>
          <material-button (click)="clearFieldErrors()"
                           (trigger)="save()"
                           raised>
            Save
          </material-button>
          <material-button (click)="editUserForm.reset()">
            Clear
          </material-button>
          <material-button (click)="goBack()"
                           raised>
            Back
          </material-button>
        </div>
      </form>
    </div>
  </div>
</div>

Я обнаружил, что ошибка была связана с тем, что ввод строки в целое числополе ввода (age) принимается за «null», поэтому при вызове editUserForm.reset () ничего не происходит.Кто-нибудь может мне помочь, пожалуйста!

...