ioni c 4 angular 8 странная проблема с реактивными формами - PullRequest
0 голосов
/ 25 марта 2020

Я авторизован в пожарной сети в моем приложении ioni c. После успеха я перенаправляю пользователей на страницу details, которая запрашивает у пользователя имя и адрес электронной почты. Но есть странная проблема. После перенаправления имя формы и адрес электронной почты всегда недействительны, даже если введены правильные значения. Если я перефразирую sh страницу, она работает нормально.

Я не могу понять, что происходит не так. Я использовал невидимую ReCaptcha для проверки подлинности телефона с помощью firebase, если это имеет значение

Заранее спасибо, вот код

.ts

userDetails = this.fb.group({
    name : ['', [Validators.required, Validators.minLength(3), Validators.maxLength(30), Validators.pattern('[a-zA-Z ]*') ] ],
    Email : ['', [ Validators.required , Validators.pattern('^[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,4}$') ]],
  })

 submit(email, name ){

    console.log(email)
    console.log(name)

}

. html

  <form [formGroup] = "userDetails">

      <ion-card>
        <ion-item>
            <ion-label position="floating">Enter your name</ion-label>
            <ion-input formControlName = "name" type = "text"></ion-input>
        </ion-item>
        <div style="color:red; padding-top: 0.2rem" *ngIf= "name.invalid && name.touched">
          <small *ngIf = "name.errors?.required"  class="text-danger"> name is required</small>
          <small *ngIf = "name.errors?.minlength" class="text-danger"> name must be at least 3 characters </small>
          <small *ngIf = "name.errors?.pattern" class="text-danger"> Enter valid name </small>

       </div>
          <br>
        <ion-item>
        <ion-label position="floating">Enter your email </ion-label>
          <ion-input formControlName = "Email" type = "text"></ion-input>
        </ion-item>

          <div style="color:red; padding-top: 0.2rem" *ngIf= "Email.invalid && Email.touched">
          <small *ngIf = "Email.errors?.pattern" class="text-danger"> Enter a valid email address </small>

          </div>

          <br>
          <br>
          <ion-button type="submit" [disabled]="!userDetails.valid" (click)="submit(Email.value, name.value )">Submit</ion-button>
        </ion-card>


      </form>

Иногда это также показывает эту ошибку

 Uncaught (in promise) Timeout (g)
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...