2017-01-09 34 views
5

Sự an toàn dưới đây hoạt động tốt trong trình duyệt.Làm thế nào để hiển thị thông báo lỗi trên các biểu mẫu trong ionic 2

Đây là .html tôi

<ion-item> 
    <ion-label primary floating>FIRST NAME</ion-label> 
    <ion-input type="text" id="firstname" class="form-control" formControlName="firstname"></ion-input> 
</ion-item> 

<p *ngIf="myForm.controls.firstname.errors && myForm.controls.firstname.dirty "> 
    <small class="up"> 
     <strong> <i> Min 3 chars</i></strong> 
    </small> 
</p> 

đây là .ts tôi nộp

this.myForm = new FormGroup({ 
      'firstname'  : new FormControl('',[Validators.required,Validators.minLength(3),Validators.maxLength(10)]), 
      'lastname'  : new FormControl('', [Validators.required,Validators.minLength(1),Validators.maxLength(10)]), 
      'useridphone' : new FormControl('', [Validators.required,Validators.minLength(10),Validators.maxLength(10)]), 
      'password'  : new FormControl('',Validators.compose([Validators.required,Validators.minLength(4),Validators.maxLength(25), 
           Validators.pattern(this.passwordRegex)])), 
      'confirmpassword': new FormControl('',Validators.required), 
      'email'   : new FormControl('', Validators.compose([ Validators.required, Validators.pattern(this.emailRegex) ])) 
    }) 

Khi tôi cố gắng để xây dựng dự án của tôi (`ion build android ') tôi đang nhận được lỗi ở bên dưới

Thuộc tính 'firstname' không tồn tại trên loại '{[key string]: AbstractControl; } '.

ở đây là tôi ionic info

Cordova CLI: 6.3.0 
Ionic Framework Version: 2.0.0-rc.3 
Ionic CLI Version: 2.1.14 
Ionic App Lib Version: 2.1.7 
Ionic App Scripts Version: 0.0.45 
ios-deploy version: Not installed 
ios-sim version: Not installed 
OS: Linux 4.4 
Node Version: v6.0.0 
Xcode version: Not installed 

Trả lời

6

Bạn cần phải truy cập formControls theo cách này:

myForm.controls['firstname'] 

Thay đổi p thẻ của bạn để:

<p *ngIf="myForm.controls['firstname'].errors && myForm.controls['firstname'].dirty "> 
+0

Tôi sẽ sử dụng myForm.controls ['firstname']. được chạm vào để nó không hiển thị thông báo lỗi cho đến khi sử dụng r đã nhập thông tin và chuyển sang một trường khác. –

Các vấn đề liên quan