fix(module:tabs): repeat rendering the TabBarExtra when used nested t…

…abs (#489) close #452
NG-ZORRO · Nov 4, 2017 · 3289e7f · 3289e7f
1 parent ad5bc29
commit 3289e7f
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 3 deletions.
diff --git a/src/components/tabs/nz-tabset.component.ts b/src/components/tabs/nz-tabset.component.ts
@@ -49,7 +49,7 @@ export type NzTabType = 'line' | 'card';
         [nzHideBar]="nzHide"
         [selectedIndex]="nzSelectedIndex">
         <ng-template #tabBarExtraContent>
-          <ng-template [ngTemplateOutlet]="nzTabBarExtraContent"></ng-template>
+          <ng-template [ngTemplateOutlet]="nzTabBarExtraTemplate || nzTabBarExtraContent"></ng-template>
         </ng-template>
         <div
           nz-tab-label
@@ -90,6 +90,7 @@ export class NzTabSetComponent implements AfterContentChecked, OnInit, AfterView
   _selectedIndex: number | null = null;
   _isViewInit = false;
   _tabs: Array<NzTabComponent> = [];
+  @Input() nzTabBarExtraTemplate: TemplateRef<any>;
   @ContentChild('nzTabBarExtraContent') nzTabBarExtraContent: TemplateRef<any>;
   @ViewChild('tabNav') _tabNav: NzTabsNavComponent;
   @ViewChild('tabContent') _tabContent: ElementRef;

diff --git a/src/showcase/nz-demo-tabs/nz-demo-tabs-extra.component.ts b/src/showcase/nz-demo-tabs/nz-demo-tabs-extra.component.ts
@@ -3,14 +3,14 @@ import { Component, OnInit } from '@angular/core';
 @Component({
   selector: 'nz-demo-tabs-extra',
   template: `
-    <nz-tabset>
+    <nz-tabset [nzTabBarExtraTemplate]="tabBarExtraContent">
       <nz-tab *ngFor="let tab of tabs">
         <ng-template #nzTabHeading>
          Tab {{tab.index}}
         </ng-template>
         <span>Content of tab {{tab.index}}</span>
       </nz-tab>
-      <ng-template #nzTabBarExtraContent>
+      <ng-template #tabBarExtraContent>
         <button nz-button>Extra Action</button>
       </ng-template>
     </nz-tabset>`,

diff --git a/src/showcase/nz-demo-tabs/nz-demo-tabs.html b/src/showcase/nz-demo-tabs/nz-demo-tabs.html
@@ -115,6 +115,12 @@ <h3 id="Tabs"><span>nz-tabset</span>
           <td>Boolean</td>
           <td>true</td>
         </tr>
+        <tr>
+          <td>nzTabBarExtraTemplate</td>
+          <td>用于指定 tab bar 上特定的额外的元素</td>
+          <td>TemplateRef</td>
+          <td>无</td>
+        </tr>
         <tr>
           <td>#nzTabBarExtraContent</td>
           <td>tab bar 上额外的元素</td>