Angular4, kann nicht Inhalt verstecken

Question

ich habe Komponente in Winkel 4 Rahmen, der wie folgt

import { ListService } from '../list/list.service'; 
import { Component, OnInit } from '@angular/core'; 
import { ActivatedRoute } from '@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) 
    } 
} 

während ersten *ngIf="row?.id" funktioniert gut, der zweite verhält sich seltsam Bedeutung ist immer true, habe ich etwas falsch gemacht aussieht?

EDIT:

, wenn ich es getestet es scheint, dass ViewComponent nicht korrekt aktualisiert wird, wenn ich console.log innen constructor > after if condition Viewcomponent haben 3 Eigenschaften route, service und row ausführen Sinn, aber wenn ich erstellt Funktion

showInfo(){ 
    console.log(this) 
} 

jetzt this ->ViewComponent haben nur 2 Eigenschaften route und service

Kann dies ein Problem mit dem Oszilloskop sein?

Answer 1

sollten Sie verwenden die folgende

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

*ngIf="!row" prüft, dass row === false

Answer 2

*ngIf="!row" prüft diese Zeile ist ein falsy Wert (Bedeutung row == false, was wiederum bedeuten kann, wenn Zeile ein Objekt ist, dass Zeile ist entweder null oder undefined).

Solange Ihre Zeile nicht null oder undefined ist, wird diese Bedingung wahr und "Test" wird angezeigt.

Wenn Sie das Gegenteil Überprüfung Ihrer ersten *ngIf wollen, ist es nur ganz negieren:

<div *ngIf="!(row?.id)">test</div> 

(Klammer nur für Klarheit)