Null guarding with *ngIf

The idea strategy will be to use *ngIf, which is a structural directive, meaning Angular will stop traversing DOM tree elements beyond a falsy statement.

In the CurrentWeather component, we can easily check to see whether the current variable is null or undefined before attempting to render the template:

  1. Update the topmost div element with *ngIf to check whether current is an object, as shown:
src/app/current-weather/current-weather.component.html<div *ngIf="current">  ...</div>

Now observe the console log and that no errors are being reported. You always ensure that your Angular application reports zero console errors. If you're still seeing errors in the console log, ensure that you have correctly reverted the ...

Get Angular 6 for Enterprise-Ready Web Applications now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.