Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Cannot read property 'errors' of undefined in angular 2

Tags:

html

angular

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?

like image 492
MMR Avatar asked Jun 25 '16 12:06

MMR


People also ask

How do you fix undefined properties Cannot be read?

The “cannot read property of undefined” error occurs when you attempt to access a property or method of a variable that is undefined . You can fix it by adding an undefined check on the variable before accessing it.

Can not read the property of undefined typescript?

The "Cannot read properties of undefined" error occurs when you try to access a property or a method on a variable that stores an undefined value. To solve the error, check if the variable is not undefined before accessing the property or method.

What is TypeError Cannot read property of undefined?

Causes for TypeError: Cannot Read Property of Undefined In short, the value is not assigned. In JavaScript, properties or functions are Objects, but undefined is not an object type. If you call the function or property on such variable, you get the error in console TypeError: Cannot read undefined properties.

How do you fix TypeError Cannot read properties of null?

To solve the "Cannot read property 'value' of null" error, make sure you aren't accessing the value property on a null value, e.g. a non-existent DOM element. An element with the provided id does not exist in the DOM, so the getElementById method returns null .


1 Answers

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"
like image 171
hholtij Avatar answered Sep 28 '22 11:09

hholtij