fix(module:description): fix description not accept TemplateRef (#5139)

* fix(module:description): fix description not accept TemplateRef close #5127 * fix: fix nzTitle type
NG-ZORRO · Apr 26, 2020 · 90d2ec5 · 90d2ec5
1 parent 654411e
commit 90d2ec5
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 5 deletions.
diff --git a/components/descriptions/descriptions-item.component.ts b/components/descriptions/descriptions-item.component.ts
@@ -30,7 +30,7 @@ export class NzDescriptionsItemComponent implements OnChanges, OnDestroy {
   @ViewChild(TemplateRef, { static: true }) content: TemplateRef<void>;
 
   @Input() @InputNumber() nzSpan = 1;
-  @Input() nzTitle: string = '';
+  @Input() nzTitle: string | TemplateRef<void> = '';
 
   readonly inputChange$ = new Subject<void>();
 

diff --git a/components/descriptions/descriptions.component.ts b/components/descriptions/descriptions.component.ts
@@ -60,7 +60,11 @@ const defaultColumnMap: { [key in NzBreakpointEnum]: number } = {
                 <!-- Horizontal & NOT Bordered -->
                 <ng-container *ngIf="!nzBordered">
                   <td class="ant-descriptions-item" [colSpan]="item.span">
-                    <span class="ant-descriptions-item-label" [class.ant-descriptions-item-colon]="nzColon">{{ item.title }}</span>
+                    <span class="ant-descriptions-item-label" [class.ant-descriptions-item-colon]="nzColon">
+                      <ng-container *nzStringTemplateOutlet="item.title">
+                        {{ item.title }}
+                      </ng-container>
+                    </span>
                     <span class="ant-descriptions-item-content">
                       <ng-template [ngTemplateOutlet]="item.content"></ng-template>
                     </span>
@@ -69,7 +73,9 @@ const defaultColumnMap: { [key in NzBreakpointEnum]: number } = {
                 <!-- Horizontal & Bordered -->
                 <ng-container *ngIf="nzBordered">
                   <td class="ant-descriptions-item-label" *nzStringTemplateOutlet="item.title">
-                    {{ item.title }}
+                    <ng-container *nzStringTemplateOutlet="item.title">
+                      {{ item.title }}
+                    </ng-container>
                   </td>
                   <td class="ant-descriptions-item-content" [colSpan]="item.span * 2 - 1">
                     <ng-template [ngTemplateOutlet]="item.content"></ng-template>
@@ -86,7 +92,11 @@ const defaultColumnMap: { [key in NzBreakpointEnum]: number } = {
                 <tr class="ant-descriptions-row">
                   <ng-container *ngFor="let item of row; let isLast = last">
                     <td class="ant-descriptions-item" [colSpan]="item.span">
-                      <span class="ant-descriptions-item-label" [class.ant-descriptions-item-colon]="nzColon">{{ item.title }}</span>
+                      <span class="ant-descriptions-item-label" [class.ant-descriptions-item-colon]="nzColon">
+                        <ng-container *nzStringTemplateOutlet="item.title">
+                          {{ item.title }}
+                        </ng-container>
+                      </span>
                     </td>
                   </ng-container>
                 </tr>
@@ -107,7 +117,9 @@ const defaultColumnMap: { [key in NzBreakpointEnum]: number } = {
                 <tr class="ant-descriptions-row">
                   <ng-container *ngFor="let item of row; let isLast = last">
                     <td class="ant-descriptions-item-label" [colSpan]="item.span">
-                      {{ item.title }}
+                      <ng-container *nzStringTemplateOutlet="item.title">
+                        {{ item.title }}
+                      </ng-container>
                     </td>
                   </ng-container>
                 </tr>