材质标签按钮替代模式

时间:2019-12-13 07:20:40

标签: angular angular-material

我正在使用material tabs,并且每个标签页都有一个过滤器菜单,但是问题是,当此菜单打开背景标签页按钮时会覆盖它。

enter image description here

请让我知道如何使用CSS解决此问题?

MainComponent

<mat-tab-group >

 <mat-tab *ngFor="let tab of tabs; let index = index" [label]="tab">

  <div *ngIf="tab=='TBS'">


   //This is filter modal 

    <sitesearchfilter-menu [@slideInOut]="menuState" (closeMenuEvent)="toggleMenu()"  [TBSDd]="tbsFilter"  [tab]="tab"   (TBSReportEvent)="getTBSReport($event)"></sitesearchfilter-menu>

     //This is tab stuff

    <app-tbstbl *ngIf="showTBSTbl" [model]="siteModel" [TBSCol]="" [TBSData]="TBSDataSet"></app-tbstbl>

    </div>

   </mat-tab>

过滤器

<div *ngIf="TrackReport">

        <div fxLayout="row">
                <div fxFlex.gt-sm="100%">
                    <mat-card>
                        <mat-card-content>
                            <mat-card-title>

                                    <button   mat-raised-button color="primary" (click)="closeEvent()" type="button"><mat-icon>filter_list</mat-icon>
                                        Filter</button>

                            </mat-card-title>


                            <form 
                            #dF="ngForm"
                            (ngSubmit)="submitTBS(dF.value)"
                            >


                    <FORM STUFF HERE>                        


                        </form>


                        </mat-card-content>
                    </mat-card>
                </div>
            </div>


    </div>

0 个答案:

没有答案