From f99d7ff3578e05d1382e9a36ebd805a255383bac Mon Sep 17 00:00:00 2001
From: Yadong Xie <yadong.xyd@alibaba-inc.com>
Date: Mon, 15 Jun 2020 21:31:30 +0800
Subject: [PATCH] fix(module:select): fix select nzCustomContent render (#5425)

close #5178
---
 components/select/option-container.component.ts | 12 +++++++++---
 components/select/option-item.component.ts      |  5 ++++-
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/components/select/option-container.component.ts b/components/select/option-container.component.ts
index a0f419a0ff6..895bc090057 100644
--- a/components/select/option-container.component.ts
+++ b/components/select/option-container.component.ts
@@ -35,12 +35,18 @@ import { NzSelectItemInterface, NzSelectModeType } from './select.types';
         [class.full-width]="!matchWidth"
         [itemSize]="itemSize"
         [maxBufferPx]="itemSize * maxItemLength"
-        [minBufferPx]="itemSize * maxItemLength"
+        [minBufferPx]="itemSize"
         (scrolledIndexChange)="onScrolledIndexChange($event)"
         [style.height.px]="listOfContainerItem.length * itemSize"
         [style.max-height.px]="itemSize * maxItemLength"
       >
-        <ng-container *cdkVirtualFor="let item of listOfContainerItem; trackBy: trackValue">
+        <ng-template
+          cdkVirtualFor
+          [cdkVirtualForOf]="listOfContainerItem"
+          [cdkVirtualForTrackBy]="trackValue"
+          [cdkVirtualForTemplateCacheSize]="0"
+          let-item
+        >
           <ng-container [ngSwitch]="item.type">
             <nz-option-item-group *ngSwitchCase="'group'" [nzLabel]="item.groupLabel"></nz-option-item-group>
             <nz-option-item
@@ -60,7 +66,7 @@ import { NzSelectItemInterface, NzSelectModeType } from './select.types';
               (itemClick)="onItemClick($event)"
             ></nz-option-item>
           </ng-container>
-        </ng-container>
+        </ng-template>
       </cdk-virtual-scroll-viewport>
       <ng-template [ngTemplateOutlet]="dropdownRender"></ng-template>
     </div>
diff --git a/components/select/option-item.component.ts b/components/select/option-item.component.ts
index c76bdcfd29b..d34f0b1984f 100644
--- a/components/select/option-item.component.ts
+++ b/components/select/option-item.component.ts
@@ -20,7 +20,10 @@ import { NzSafeAny } from 'ng-zorro-antd/core/types';
   selector: 'nz-option-item',
   template: `
     <div class="ant-select-item-option-content">
-      <ng-container *ngIf="!customContent; else template">{{ label }}</ng-container>
+      <ng-container *ngIf="!customContent">{{ label }}</ng-container>
+      <ng-container *ngIf="customContent">
+        <ng-template [ngTemplateOutlet]="template"></ng-template>
+      </ng-container>
     </div>
     <div *ngIf="showState && selected" class="ant-select-item-option-state" style="user-select: none" unselectable="on">
       <i nz-icon nzType="check" class="ant-select-selected-icon" *ngIf="!icon; else icon"></i>