CODEWITHSUNDEEP
htmlangular
MMR
MMR

Reputation: 3019

Cannot read property 'errors' of undefined in angular 2

I am validating my template using angular2, but meanwhile it shows this error:

 Cannot read the property 'errors' of undefined.

Here is my template:

<h3 class = "head">{{title}}</h3>
<form  [ngFormModel]="form" #f="ngForm">
  <div class="row">
    <div class="form-group">     
      <label class="formHeading">Facebook</label>
      <input type="text" id="facebook" class="form-control col-xs-3"  ngControl="facebook" #facebook="ngForm" >  
    </div>
    <div *ngIf ="facebook.touched  && facebok.errors">  
      <div class="form-row btn">
      <button type="submit" class="btn btn-primary pull-right butspace" [disabled]="!f.valid">Save</button>
    </div>
  </div>
</form>

I dont know why it shows this error. Can anyone fix it?

Upvotes: 10

Views: 40893

Answers (1)

hholtij
hholtij

Reputation: 2936

First of all, you have facebok instead of facebook on the error property.

If that doesn't fix it you're probably using the facebook object before it is assigned, which can happen if it's an @Input() for example.

Use the Elvis operator:

*ngIf ="facebook?.touched && facebook?.errors"

Upvotes: 24

Related Questions