Cannot read property 'hasError' of undefined


#1

I have the problem with the validation.

TypeError: Cannot read property ‘hasError’ of undefined
at Object.View_LoginPage_0._co [as updateDirectives] (ng:///LoginPageModule/LoginPage.ngfactory.js:189:34)
at Object.debugUpdateDirectives [as updateDirectives] (http://localhost:8100/build/vendor.js:13443:21)
at checkAndUpdateView (http://localhost:8100/build/vendor.js:12620:14)
at callViewAction (http://localhost:8100/build/vendor.js:12988:21)
at execComponentViewsAction (http://localhost:8100/build/vendor.js:12920:13)
at checkAndUpdateView (http://localhost:8100/build/vendor.js:12626:5)
at callViewAction (http://localhost:8100/build/vendor.js:12988:21)
at execEmbeddedViewsAction (http://localhost:8100/build/vendor.js:12946:17)
at checkAndUpdateView (http://localhost:8100/build/vendor.js:12621:5)
at callViewAction (http://localhost:8100/build/vendor.js:12988:21)

 <form [formGroup]="formgroup">
<ion-list>
  <ion-item>
    <ion-label floating>Mobile</ion-label>
    <ion-input type="number" formControlName="mobile"></ion-input>
   
  </ion-item>
  <ion-item *ngIf="mobile.hasError('required') &&  mobile.touched">
    <p>mobile required</p>
  </ion-item>
  <ion-item *ngIf="mobile.hasError('minlength') &&  mobile.touched">
      <p>min 10 num required</p>
  </ion-item>
  <ion-item *ngIf="mobile.hasError('minlength') &&  mobile.touched">
      <p>max 10 num required</p>
  </ion-item>
</ion-list>
<ion-list>
    <ion-item>
      <ion-label floating>Password</ion-label>
      <ion-input type="password" formControlName="password"></ion-input>
      
    </ion-item>
    <ion-item *ngIf="password.hasError('required') &&  password.touched">
        <p>password required</p>
      </ion-item>
  
  </ion-list>

  <div padding>
      <button [disabled]="!formgroup.valid" (click)="doLogin()"ion-button color="danger" block>{{ 'LOGIN_BUTTON' | translate }}</button>
    </div>
  </form>