Обработка типов ввода чисел, таких как тел или время в угловых 6 реактивных формах? - PullRequest
Новая
       11

Обработка типов ввода чисел, таких как тел или время в угловых 6 реактивных формах?

0 голосов
/ 04 ноября 2018

Ниже вы увидите мою форму шаблона / HTML, однако, валидатор не позволяет мне обрабатывать входные данные как строки? Не могли бы вы объяснить, что мне не хватает? Очевидные текстовые вводы обрабатываются и проверяются, но я не смог найти пример того, как вы можете обрабатывать типы ввода чисел, такие как телефон и время. Можем ли мы использовать метод javascript toString () где-нибудь для преобразования их в строку? Пример кода HTML 

<mat-form-field>
  <input matInput type="text" formControlName="title" placeholder="Student Name">
  <mat-error *ngIf="form.get('title').invalid">Please enter a Student Name.</mat-error>
</mat-form-field>
<mat-form-field>
  <input matInput type="tel" formControlName="telephone" placeholder="telephone">
  <mat-error *ngIf="form.get(telephone).invalid">Please enter a telephone.</mat-error>
</mat-form-field>
<mat-form-field>
  <input matInput type="Time" formControlName="pickUpTime" placeholder="PickUp Time">
  <mat-error *ngIf="form.get('pickUpTime').invalid">Please enter a Pickup Time.</mat-error>
</mat-form-field>
<mat-form-field>
  <input matInput type="Time" formControlName="dropOffTime" placeholder="DropOff Time">
  <mat-error *ngIf="form.get('dropOffTime').invalid">Please enter a Dropoff Time.</mat-error>
</mat-form-field>

Файл Component.ts для настройки реактивной формы: 

ngOnInit() {
this.form = new FormGroup({
  title: new FormControl(null, {
    validators: [Validators.required, Validators.minLength(3)]
  }),
  telephone: new FormControl(null,{
    validators: [
      Validators.required,
      Validators.minLength(5) ]
  }),
  pickUpTime: new FormControl(null, {
    validators: [
      Validators.required,
      Validators.minLength(5) ]
  }),
  dropOffTime: new FormControl(null, {
    validators: [
      Validators.required,
      Validators.minLength(5) ]
  })

1 Ответ

0 голосов
/ 04 ноября 2018

Я не вижу причин, по которым вы не смогли бы справиться с этими входами. Реальный вопрос - нужно ли их разбирать на строки? Мое предложение состоит в том, чтобы сохранить эти входные данные в их собственных типах, которые могут использовать их функции позже. Может быть, вам поможет следующий пример кода. 

onSubmit(){
   if(this.form.valid){
      let title: string = this.form.get('title').value;
      let telephone: number = this.form.get('title').value;
      let pickUpTime: Date = this.form.get('title').value;
      let dropOffTime: Date = this.form.get('title').value;
      //Do something
   }     
}
...