javascript - Angular4, can't hide content -

i have component in angular 4 framework looks this

import { listservice } '../list/list.service'; import { component, oninit } '@angular/core'; import { activatedroute } '@angular/router';  @component({   selector: 'view',   template: `   <div *ngif="row?.id">     <div>       <p>{{row.id}}</p>       <p>{{row.name}}</p>       <p>{{row.weight}}</p>       <p>{{row.symbol}}</p>     </div>   </div>   <div *ngif="!row">test</div>    <router-outlet></router-outlet>   `,   styles: [] }) export class viewcomponent implements oninit {    constructor(private route: activatedroute,     private service: listservice) {     this.route.params.subscribe(params => {       const id = parseint(params['id']);       if (id) {         this.row = this.service.getrow(id);         console.log(this);       }     });   }    row;    ngoninit() { }   showinfo(){       console.log(this)   } } 

while first *ngif="row?.id" works fine, second behaves strange meaning true, have done wrong?

edit:

when tested it seems viewcomponent not updated properly, meaning when execute console.log inside constructor > after if condition viewcomponent have 3 properties route, service , row when created function

showinfo(){     console.log(this) } 

now this -> viewcomponent have 2 properties route, , service

can problem scope ?

you should use following

<div *ngif="row === undefined">test</div> 

*ngif="!row" checking row === false