我有这个HTML：

<ion-grid *ngIf="headerService.showSearch()">
            <ion-row id="searchbar" class="main-searchbar ion-align-items-center">
              <ion-col size="11">
                <ion-searchbar class="custom" placeholder="Buscar entre mis productos" type="text"
                  showClearButton="never" id="searchInput" #searchBar (ionInput)="headerService.onSearchInput($event)"
                  (keyup.enter)="headerService.onEnterPress($event)"></ion-searchbar>
              </ion-col>
              <ion-col size="1" id="trigger-filter">
                <svg xmlns="" width="20" height="20" fill="#808080"
                  class="bi bi-funnel-fill ion-float-right" viewBox="0 0 16 16">
                  <path
                    d="M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5v-2z" />
                </svg>
              </ion-col>
              <app-search-popover></app-search-popover>
            </ion-row>
          </ion-grid>

现在，当你点击离子柱时弹出窗口就会打开。那也没关系但是现在，在离子山坳下面开了一家店。
Popover的代码：

<ion-popover trigger="trigger-filter" triggerAction="click" interface="popover" side="bottom" size="auto"
    [dismissOnSelect]="false" class="custom-popover" show-backdrop="false">
    <ng-template class="content-popover">
        <ion-grid>
            <ion-list>
                <ion-row class="underline-input">
                    <ion-input placeholder="Nombre" id="name" />
                </ion-row>
                <ion-row class="underline-input">
                    <ion-input placeholder="SKU" id="sku" />
                </ion-row>
                <ion-row class="column-item underline-input">
                    <ion-col>
                        <ion-text><b>Precio</b></ion-text>
                    </ion-col>
                    <ion-col>
                        <ion-input placeholder="Desde" id="min" />
                    </ion-col>
                    <ion-col>
                        <ion-input placeholder="Hasta" id="max" />
                    </ion-col>
                </ion-row>
                <ion-row class="column-item underline-input">
                    <ion-select placeholder="Categorias" interface="popover" id="category" >
                        <ion-select-option *ngFor="let item of headerService.categories" value="{{item.id}}">{{item.name}}</ion-select-option>
                    </ion-select>
                </ion-row>
                <ion-row>
                    <ion-col size="12">
                        <ion-button style="width: 100%;" color="buttoncolor"  (click)="headerService.sendOptions()">
                            Buscar
                        </ion-button>
                    </ion-col>
                </ion-row>
            </ion-list>
        </ion-grid>
    </ng-template>
</ion-popover>

我希望弹出窗口以离子网格作为参考。有办法吗？