How to give boolean value to html in angular?

Question

How do i give the showProduct:boolean = false; value to the app-product html selector so it will be false at start?

showProduct:boolean = false;

<button (click)="showProduct=!showProduct">Show Product</button>
<div *ngIf="!showProduct">
    <app-product></app-product>    
</div>

Your code seems correct, try to check that the HTML of the app-product component is not empty — Mahmoud
– Mahmoud, Commented Nov 14, 2017 at 8:20
If you are trying to pass an agument to the child component you need to use binding input property angular.io/guide/… — Iker Vázquez
– Iker Vázquez, Commented Nov 14, 2017 at 8:30

Sajeetharan · Accepted Answer · 2017-11-14 08:14:50Z

3

I think you need <div *ngIf="showProduct">,

<button (click)="showProduct=!showProduct">Show Product</button>
<div *ngIf="showProduct">
    <app-product></app-product>    
</div>

answered Nov 14, 2017 at 8:14

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Thanks for the answer :D