feat(angular): support id input

Author: vltansky

playground/angular/src/app/app.component.html

@@ -10,6 +10,7 @@
       [centeredSlides]="true"
       navigation
       class="mySwiper"
+      id="mySwiperID"
     >
       <ng-template swiperSlide *ngFor="let slide of virtualSlides; index as i"
         >Slide {{ slide }}</ng-template

playground/angular/src/app/app.component.scss

@@ -4,5 +4,9 @@
 
 .mySwiper {
   background: #ccc;
-  padding: 2 0px 0;
+  padding: 30px 0;
+}
+
+#mySwiperID {
+  border: 1px solid red;
 }

src/angular/src/swiper.component.html

@@ -5,7 +5,7 @@
 </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(' ')">
+<div [ngClass]="[wrapperClass, class].join(' ')" [attr.id]="id">
   <ng-content select="[slot=wrapper-start]"></ng-content>
   <ng-template
     *ngTemplateOutlet="

src/angular/src/swiper.component.ts

@@ -162,6 +162,7 @@ export class SwiperComponent implements OnInit {
   @Input() thumbs: SwiperOptions['thumbs'];
   @Input() zoom: SwiperOptions['zoom'];
   @Input() class: string;
+  @Input() id: string;
   @Input()
   set navigation(val) {
     const currentNext = typeof this._navigation !== 'boolean' ? this._navigation?.nextEl : null;