Can't bind to 'ngIf' since it isn't a known property of 'div'.

Bug Report

Description using *ngIf in component template causes an error in browser console and no content is displayed.

Ionic Info

Ionic:

   ionic (Ionic CLI)          : 4.0.5 (/usr/local/lib/node_modules/ionic)
   Ionic Framework            : @ionic/angular 4.0.0-beta.1
   @angular-devkit/core       : 0.7.2
   @angular-devkit/schematics : 0.7.2
   @angular/cli               : 6.1.2
   @ionic/ng-toolkit          : 1.0.5
   @ionic/schematics-angular  : 1.0.4

Cordova:

   cordova (Cordova CLI) : 6.5.0
   Cordova Platforms     : browser 4.1.0

System:

   ios-deploy : 1.9.2
   ios-sim    : 5.0.13
   NodeJS     : v9.4.0 (/usr/local/lib/node_modules/node/bin/node)
   npm        : 6.0.1
   OS         : macOS Sierra
   Xcode      : Xcode 9.2 Build version 9C40b

Environment:

   ANDROID_HOME : not set

   Angular CLI: 6.1.2
   Node: 9.4.0
   OS: darwin x64
   Angular: 6.1.2

Related Code

  LocComponent is an @ionic/angular component 

  location is passed in
  @Input() location:any

  --- this mark up causes error in console and no content is displayed

 <div *ngIf="location.hour">
           {{location.hour}}
           {{location.day}}
           {{location.timezone}}
 </div>

 -- this mark up works
 <div>
           {{location.hour}}
           {{location.day}}
           {{location.timezone}}
 </div>

Expected Behavior

<div> should be displayed if condition is set, otherwise not displayed, according to the rules of angular.

Additional Context browser console trace: Template parse errors: Can't bind to 'ngIf' since it isn't a known property of 'div'. (" <span class="badge">2</span> <span class="badge">1</span> <div [ERROR ->]*ngIf="location && location.hour"> {{location.hour}} {{location.day}} "): ng:///ComponentsModule/LocComponent.html@7:15 Property binding ngIf not used by any directive on an embedded template. Make sure that the property name is spelled correctly and all directives are listed in the "@NgModule.declarations". (" <span class="badge">2</span> <span class="badge">1</span> [ERROR ->]<div *ngIf="location && location.hour"> {{location.hour}} {{location.day}} "):

[grimace]

Yes, you are correct. I went through my code and discovered that the components.module.ts file did not have import { CommonModule } from '@angular/common'; it is now resolved. Thank you.

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.