返されるjson値がnullであるかどうかをチェックする方法

Question

jsonの値がnullであるかどうかをチェックしたいと思います。 info.picがnullの場合、画像をアップロードするフォームを表示できるようにしたい場合は、jsonで返された画像を表示します。

マイHTML

<div class="col-sm-9" *ngFor="let info of dInfo"> 
    <img [src]="'data:image/JPG;base64,' + info.pic"/> 
</div> 
     <h1>name: </h1> 
     <p> {{ info.name }} </p> 
    </div> 

// The upload form that I want to hide 
    <label for="image">Upload</label> 
    <input #fileInput type="file" id="image"/> 
    <button class="btn" (click)="upload()">Upload Image</button> 

サービス

byID(id: any): Observable<any> 
{ 
    return this.http.get('') 
    .map(
     (response: Response) => { 
     return response.json().info; 
     } 
    ); 
} 

成分

getById(ID: any) { 
    this.infoService.byID(ID) 
    .subscribe(
     (dInfo2: DInterface[]) => { 
     this.dInfo2 = dInfo2 
     }, 
     (error: Response) => console.log(error) 
    ); 
} 

インタフェース

export interface DInterface { 

    id: number; 
    name: string; 
    pic: any; 

}

JSON応答

http://imgur.com/a/u6KZu

Answer 1

使用*ngIf。あなたのケースでは

：

<img *ngIf="(info.pic | json) != '{}'" [src]="'data:image/JPG;base64,' + info.pic"/> 

Documentation for ngIf

アップデート1：

で試してみてください：

<img *ngIf="info?.pic" [src]="'data:image/JPG;base64,' + info.pic"/>