Question

我试图阻止用户在键盘上键入符号和表情符号，为此，我正在使用模式验证器，但是当我在输入中键入内容时，会出现

无法读取null的“必需”属性

如何解决这个问题？

   <form [formGroup]="instituicao">
     <p>Informe os dados:</p>
      <ion-item>
        <ion-label stacked>ONG:</ion-label>
        <ion-input type="text" formControlName="ong"></ion-input>
      </ion-item>
      <ion-item *ngIf="!instituicao.controls.ong.valid & 
      (instituicao.controls.ong.dirty || instituicao.controls.ong.touched)">
      <div [hidden]="!instituicao.controls.ong.errors.required">
        O campo é obrigatório
      </div>
    </ion-item>
    <ion-item text-center *ngIf="
      instituicao.controls.ong.valid">
      <div [hidden]="
        !instituicao.controls.ong.valid">
        <button ion-button outline large color="danger" 
          (click)="createAccount()">Cadastrar</button>
      </div>
      </ion-item>
   </form>

import { FormBuilder, FormGroup, Validators } from '@angular/forms';

  instituicao: FormGroup;
  instituicao_array: any;

this.instituicao_array = this.navParams.data.instituicao || {};//inside constructor
this.createForm();//inside constructor

createForm() {
    this.instituicao = this.formBuilder.group({
      key: [this.instituicao_array.key, Validators.required],
      ong: [this.instituicao_array.ong,Validators.required, Validators.pattern('[a-zA-Z ]*')]
    })
  }

Answer 1

更改：

<div [hidden]="!instituicao.controls.ong.errors.required">
    O campo é obrigatório
</div>

至：

<div [hidden]="!instituicao.controls.ong.errors?.required">
    O campo é obrigatório
</div>

仅通过添加 ?

使用安全导航

请参阅：https://angular.io/guide/template-syntax#safe-navigation-operator

离子角验证器图案

1 个答案: