Any help with *ngIf directive in my chat app

Ionic Framework ionic-v3
1

hello guys, i’m building a chat app where user can send picture to other. Here is my json response

ngIf
ngIf.PNG908×500 30 KB

and my html code :

<div class="chat-bubble right slide-right">
            <div class="message">
                <p>{{contents.body}}</p>
                <p><img [src]="contents.attachment.url" *ngIf="contents.attachment.url"  />
            </div>
          <div class="message-detail">
            <span>{{contents.date | lowercase}}</span>
          </div>
        </div>

i want to hine the picture if it doesn’t one. any help please !!!

2 
<p *ngIf="contents.attachment !== undefined"><img [src]="contents.attachment.url" *ngIf="contents.attachment.url"  />
3

that works. Thanks:wink:

4

You could also simplify the check to be
*ngIf="contents.attachment"

Which is smaller, naturally, as well as handling more cases than it simply being undefined.

2 Likes