To call popup component from main component based on boolean flag

Question

I have a main component and a popup component and i am using popupvisible boolean flag to open it. First time it opens up but second time it is not opening .There are two components

main component.html <button icon="add" type="normal" text="Add fruit" style="margin-left: auto;" (onClick)="addfruit()"> <button> <app-add-crew [item]="popupVisible"></app-add-crew> child html

``<dx-popup 
            [width]="1000"
            [height]="580"
            [showTitle]="true"
            title="Add Crew"
            [dragEnabled]="false"
            [hideOnOutsideClick]="true"
            [showCloseButton]="true"
            container=".dx-viewport"
            [(visible)]="item"
        >`

`
 maincomponent.ts
  

addfruit() { this.popupVisible = true; }

Can anybody help how to pass boolean value to next component so that it opens everytime

let me know if more details needs to be provided