feat(module:select): fix support for multiple and tag select.

NG-ZORRO · Jun 22, 2019 · 854bce2 · 854bce2
1 parent 27ac7bf
commit 854bce2
Showing 1 changed file with 19 additions and 21 deletions.
diff --git a/components/select/nz-select-top-control.component.html b/components/select/nz-select-top-control.component.html
@@ -39,28 +39,26 @@
   </ng-container>
   <!--multiple or tags mode-->
   <ul *ngIf="nzSelectService.isMultipleOrTags">
-    <ng-container *ngIf="nzCustomTemplate; else noTemplate">
-      <ng-container *ngIf="nzSelectService.listOfCachedSelectedOption.length">
-        <ng-template [ngTemplateOutlet]="nzCustomTemplate" [ngTemplateOutletContext]="{ $implicit: nzSelectService.listOfCachedSelectedOption }"></ng-template>
-      </ng-container>
-    </ng-container>
-    <ng-template #noTemplate>
-      <ng-container *ngFor="let option of nzSelectService.listOfCachedSelectedOption | slice: 0 : nzMaxTagCount;trackBy:trackValue;">
-        <li [@zoomMotion]
-          [nzNoAnimation]="noAnimation?.nzNoAnimation"
-          [attr.title]="option.nzLabel"
-          [class.ant-select-selection__choice__disabled]="option.nzDisabled"
-          class="ant-select-selection__choice">
+    <ng-container *ngFor="let option of nzSelectService.listOfCachedSelectedOption | slice: 0 : nzMaxTagCount;trackBy:trackValue; let index = index">
+      <li [@zoomMotion]
+        [nzNoAnimation]="noAnimation?.nzNoAnimation"
+        [attr.title]="option.nzLabel"
+        [class.ant-select-selection__choice__disabled]="option.nzDisabled"
+        class="ant-select-selection__choice">
+        <ng-container *ngIf="nzCustomTemplate; else defaultMultipleTemplate">
+          <ng-template [ngTemplateOutlet]="nzCustomTemplate" [ngTemplateOutletContext]="{ $implicit: nzSelectService.listOfCachedSelectedOption[index] }"></ng-template>
+        </ng-container>
+        <ng-template #defaultMultipleTemplate>
           <div class="ant-select-selection__choice__content">{{ option.nzLabel }}</div>
-          <span *ngIf="!option.nzDisabled"
-            class="ant-select-selection__choice__remove"
-            (mousedown)="$event.preventDefault()"
-            (click)="removeSelectedValue(option, $event)">
-            <i nz-icon type="close" class="ant-select-remove-icon" *ngIf="!nzRemoveIcon; else nzRemoveIcon"></i>
-          </span>
-        </li>
-      </ng-container>
-    </ng-template>
+        </ng-template>
+        <span *ngIf="!option.nzDisabled"
+          class="ant-select-selection__choice__remove"
+          (mousedown)="$event.preventDefault()"
+          (click)="removeSelectedValue(option, $event)">
+          <i nz-icon type="close" class="ant-select-remove-icon" *ngIf="!nzRemoveIcon; else nzRemoveIcon"></i>
+        </span>
+      </li>
+    </ng-container>
     <li *ngIf="nzSelectService.listOfCachedSelectedOption.length > nzMaxTagCount"
       [@zoomMotion]
       [nzNoAnimation]="noAnimation?.nzNoAnimation"