From 12851953491155f5f96930355c91110c9a4cf753 Mon Sep 17 00:00:00 2001
From: Vladimir Kharlampidi <nolimits4web@gmail.com>
Date: Wed, 16 Jun 2021 15:53:16 +0300
Subject: [PATCH] fix(angular): don't set main `class` on wrapper element

fixes #4679
---
 src/angular/src/swiper.component.html | 45 +++++++++------------------
 1 file changed, 14 insertions(+), 31 deletions(-)

diff --git a/src/angular/src/swiper.component.html b/src/angular/src/swiper.component.html
index cbc8d0f66..4fa726ffc 100644
--- a/src/angular/src/swiper.component.html
+++ b/src/angular/src/swiper.component.html
@@ -5,66 +5,49 @@
 </ng-container>
 <div *ngIf="scrollbar && showScrollbar" class="swiper-scrollbar" #scrollbarElRef></div>
 <div *ngIf="pagination && showPagination" class="swiper-pagination" #paginationElRef></div>
-<div [ngClass]="[wrapperClass, class].join(' ')" [attr.id]="id">
+<div [ngClass]="wrapperClass" [attr.id]="id">
   <ng-content select="[slot=wrapper-start]"></ng-content>
-  <ng-template
-    *ngTemplateOutlet="
+  <ng-template *ngTemplateOutlet="
       slidesTemplate;
       context: {
         loopSlides: prependSlides,
         key: 'prepend'
       }
-    "
-  ></ng-template>
-  <ng-template
-    *ngTemplateOutlet="
+    "></ng-template>
+  <ng-template *ngTemplateOutlet="
       slidesTemplate;
       context: {
         loopSlides: activeSlides,
         key: ''
       }
-    "
-  ></ng-template>
-  <ng-template
-    *ngTemplateOutlet="
+    "></ng-template>
+  <ng-template *ngTemplateOutlet="
       slidesTemplate;
       context: {
         loopSlides: appendSlides,
         key: 'append'
       }
-    "
-  ></ng-template>
+    "></ng-template>
   <ng-content select="[slot=wrapper-end]"></ng-content>
 </div>
 <ng-content select="[slot=container-end]"></ng-content>
 
 <ng-template #slidesTemplate let-loopSlides="loopSlides" let-slideKey="key">
-  <div
-    *ngFor="let slide of loopSlides | async"
-    [ngClass]="
+  <div *ngFor="let slide of loopSlides | async" [ngClass]="
       (slide.class ? slide.class + ' ' : '') +
       slideClass +
       (slideKey !== '' ? ' ' + slideDuplicateClass : '')
-    "
-    [attr.data-swiper-slide-index]="slide.virtualIndex ? slide.virtualIndex : slide.slideIndex"
-    [style]="style"
-    [ngSwitch]="slide.zoom"
-  >
+    " [attr.data-swiper-slide-index]="slide.virtualIndex ? slide.virtualIndex : slide.slideIndex" [style]="style"
+    [ngSwitch]="slide.zoom">
     <div *ngSwitchCase="true" [ngClass]="zoomContainerClass">
-      <ng-template
-        [ngTemplateOutlet]="slide.template"
-        [ngTemplateOutletContext]="{
+      <ng-template [ngTemplateOutlet]="slide.template" [ngTemplateOutletContext]="{
           $implicit: slide.slideData
-        }"
-      ></ng-template>
+        }"></ng-template>
     </div>
     <ng-container *ngSwitchDefault>
-      <ng-template
-        [ngTemplateOutlet]="slide.template"
-        [ngTemplateOutletContext]="{
+      <ng-template [ngTemplateOutlet]="slide.template" [ngTemplateOutletContext]="{
           $implicit: slide.slideData
-        }"
-      ></ng-template>
+        }"></ng-template>
     </ng-container>
   </div>
 </ng-template>