Cannot read property 'required' of null

The code below worked for me. The '?' after courseCategory is not necessary, however, it's a workaround for a bug in Visual Studio code where the linter flags courseCategory.errors?.required" as an error stating that 'required is not defined. So for VSCode users, there's the patch until an official one is made. *ngIf="courseCategory.touched && courseCategory?.errors?.required"


I solved it this way in Angular 7+

<div *ngIf="formField.password.errors?.required" class="invalid-feedback">
Password is required
</div>

Errors won't always exist, so you have to define it like this:

<div class="alert alert-danger" *ngIf="courseCategory.touched && courseCategory.errors?.required">

With the safe operator "?"


One solution is already suggested by 'David Anthony Acosta'. I also solved it this way:

<div class="alert alert-danger" *ngIf="courseCategory.touched && !courseCategory.valid">

(The error message is supposed to be shown if the drop-down is touched, but no option has been selected).

Tags:

Forms

Angular