物化动态下拉菜单仅在第3次单击后打开，并且在使用ngIf显示隐藏事件后不会触发

Question

1）我在动态表标题中创建了一个动态列过滤器。我只有一个元素，它通过迭代* ngFor来动态生成标头。单击标题值后，将触发一个下拉菜单，该下拉菜单具有一些动态值以过滤表行。现在，问题是，当我尝试打开第二列中的过滤器而第一列中的过滤器仍处于打开状态时，下拉菜单仅在第三次单击时打开。

2）当我使用* ngIf

进行元素的显示/隐藏时，下拉触发器根本不起作用

<ng-container
                        *ngFor="
        let headerColumns of finalConfigurableColumnValueMap | keyvalue:customCompare; let i = index;">
                    <th translate style="cursor: pointer" 
                        *ngIf="headerColumns.value.showHeader"><span class="dropdown-trigger"
                        data-target="dynamicFilterDropDown"
                        (click)="dynamicFilterDropDownGenerator(headerColumns.key, i)"
                        *ngIf="headerColumns.value.showHeader" translate>{{headerColumns.value.title}}</span><i
                        *ngIf="headerColumns.value.showHeader"
                        (click)="sort(headerColumns, i)" style="margin-left: 5px;"
                        class="fa" [ngClass]="{'fa-sort': true}"> </i></th>
                    <ul id="dynamicFilterDropDown"
                        class=' dropdown-content dynamicFilterDropDownClass '>
                        <li
                            *ngFor="let dynamicColumns of dynamicFilterList; let k = index;"><label><input
                                id="selectedColumnValues{{k}}" type="checkbox"
                                (change)="selectedColumnsList(k,dynamicColumns.selectedHeader,dynamicColumns.selected )"
                                name="selectedColumnValues" class=" filled-in"
                                [(ngModel)]="dynamicColumns.selected"><span>{{
                                    dynamicColumns.filterValues }}</span> </label></li>

                    </ul>
                    </ng-container>

我希望下拉列表在第一次单击时就打开，并且应该在显示/隐藏时打开。我可能没有更新DOM属性，我也不知道该怎么做。请为此提供帮助