Angular ngClass causing error when class not defined

Viewed 271

I added a condition in the ngClass and a class like given below. there is no issue here.

[ngClass]="!tableOnly ? 'height-100p-48px' : 'full-height'"

.height-100p-48px {
  height: calc(100% - 48px);
}

But when I change the class in the condition to something like this (notice the difference, 48 changed to 40)

[ngClass]="!tableOnly ? 'height-100p-40px' : 'full-height'"

The height-100p-40px css class is not defined.

the page freezes the main thread and kills the browser. What could be the reason for this? I believed that the missing CSS classes should not cause any errors?

1 Answers

Of course it doesn't works: the class in CSS file is called "height-100p-48px" so if you point to "height-100p-40px" it doesn't work until you create this:

.height-100p-40px { height: calc(100% - 40px); }

Related