Страница открывается NumPad вместо текстовой клавиатуры в мобильном представлении (угловой) - PullRequest
0 голосов
/ 03 октября 2019

У меня есть угловое приложение и поле электронной почты (текстовое поле) - это открывает клавиатуру в мобильном представлении и не знаю, почему.

<form (ngSubmit)="onSubmit()" #emailForm="ngForm">
                <div class="emailaddress" style="text-align:center;" *ngIf="!showEmail">
                    <div style="font-size: 20px; display: inline-block;">
                        My email address is:
                    </div>   
                    <div style="display: inline-block;">
                        <label for="emailAddress" class="visually-hidden">My email address is</label>
                        <input name="emailAddress" id="emailAddress" type="tel" maxlength="50" placeholder="sample@email.com" [(ngModel)]="emailClass.emailAddress" pattern="([A-Za-z0-9-!#$%&_+`{}|']+)?(\.[A-Za-z0-9-!#$%&_+`{}|']+)*@[A-Za-z0-9-]+\.([A-Za-z0-9]{2,})+" aria-required="true" required/>
                    </div>
                    <div style="margin-bottom: 0px; margin-top: 20px;" class="error-generic" *ngIf="emailForm.touched && (emailForm.form.controls['emailAddress'].invalid && emailForm.form.controls['emailAddress'].touched)">
                        <svg height="32" viewBox="0 0 32 32" width="32"><path d="..." fill="#6d6e71"></path></svg>
                        Correct the email field to continue.
                    </div>
                    <div style="margin-top: 20px;">
                        <button id="email-me" class="button large" [disabled]="!emailForm.form.valid">Send Email</button>
                    </div>
                </div>
            </form>

1 Ответ

0 голосов
/ 03 октября 2019

Измените тип ввода на «электронная почта».

<input name="emailAddress" id="emailAddress" type="email" maxlength="50" placeholder="sample@email.com" [(ngModel)]="emailClass.emailAddress" pattern="([A-Za-z0-9-!#$%&_+`{}|']+)?(\.[A-Za-z0-9-!#$%&_+`{}|']+)*@[A-Za-z0-9-]+\.([A-Za-z0-9]{2,})+" aria-required="true" required/>

определяет поле для ввода номера телефона.

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