как уничтожить ngx-swiper-wrapper в angular 8

Question

Мне нужно уничтожить ngx-swiper-wrapper на мобильном устройстве, как это сделать

<div class="swiper-container" [swiper]="config">
<div class="swiper-wrapper">
 <div class="swiper-slide">1</div>
<div class="swiper-slide">2</div>
<div class="swiper-slide">3</div>
<div class="swiper-slide">4</div>
<div class="swiper-slide">5</div>
</div>
</div>

мой ts код файла

    @ViewChild(SwiperDirective) swiperView: SwiperDirective;
    public config: any;
constructor(public hierarchyService: HierarchyMaintenanceService) { 
    this.swiperConfig();
  }
    this.swiperView.config = {
      init: true,
    };
swiperConfig = () => {
    this.config = {
          direction: 'horizontal',
          effect: 'slide',
          slidesPerView: 3,
          breakpoints: {
            768: { slidesPerView: 2 },
            940: { slidesPerView: 3 }
          },
          navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
          }
        }
}

как уничтожить swiper в мобильном устройстве

Answer 1

Я бы использовал ElementRef и Renderer2сделать это

import { Renderer2, ElementRef } from '@angular/core'

...

constructor(private renderer:Renderer2, private el:ElementRef){

}

removeWrapper():void{
  const wrapper = this.el.nativeElement.querySelector('.swiper-wrapper')
  const parent = this.renderer.parentNode(wrapper);
  this.renderer.removeChild(parent, wrapper);
}