<modal #myModal>
<modal-header>
<h1>Material Picker</h1>
</modal-header>
<modal-content>
Brand:
<p-dropdown [(ngModel)]="selectedBrand"
[options]="brands"
id="brand"
placeholder="Select a brand"
></p-dropdown>
<br>
Product Type:
<p-multiSelect
[(ngModel)]="selectedProductType"
[options]="productTypes"
defaultLabel="Select a product type"
id="productType"
[maxSelectedLabels]="0"
selectedItemsLabel="{0} product(s) selected"
></p-multiSelect>
</modal-content>
<modal-footer>
<button (click)="closeModal()" class="btn btn-primary">close</button>
</modal-footer>
</modal>
If I open this p-multiselect or p-dropdown then click outside it doesn't close. What should I do to make this multiselect or dropdown close on clicking outside of the component?