Angular 2 将按钮添加到 md-tab-group



是否可以在md-tab-group中添加按钮或图标?例如,我有以下模板:

<md-tab-group  [selectedIndex]="selectedIndex">
  <md-tab *ngFor="let tab of getTabs() let i=index">
    <ng-template md-tab-label>
      {{tab.title}} <md-icon class="tabRemove" (click)="removeTab(i)">close</md-icon>
    </ng-template>
    <tab [tabData]="tab"></tab>
  </md-tab>
</md-tab-group>

我尝试在md-tab-group中添加一个按钮,但它没有显示。这甚至可能还是我应该找到另一种方法?

这是

可能的。

我也在用这个范围。只需添加新的md-tab标签

我的代码:

    <md-tab-group class='fixSize' [selectedIndex]='currentTab'>
        <md-tab *ngFor="let tab of tabs; let i = index;">
           <ng-template md-tab-label>
              <div class="tabName" (click)="tabRender(i)" (dblclick)="editTab(i)" mdTooltip="Duplo clique para editar" [mdTooltipPosition]="toolTipDirection">{{tab.name}}</div>
              <div *ngIf="tab.closable" class="delete" style="float: right;" (click)="removeTab(i)">x</div>
           </ng-template>
        </md-tab>
        <md-tab>
            <ng-template md-tab-label>
               <div class="tabAdd" (click)="tabAdd()" mdTooltip="Adicionar Tab" [mdTooltipPosition]="toolTipDirection">+</div>
            </ng-template>
        </md-tab>
    </md-tab-group>

您可以在<md-tab-group></md-tab-group>后添加一个按钮,并将 css 位置更改为所需的位置,并给出 z 索引 10:

button{
 postion:absolute;
 top:0;
 right:0;
 z-index:10;
}

最新更新