Slide show is not functioning properly in Multi-Directional app

Hi @Everyone
I need my application to support both (LTR & RTL).
what I have done:
added this line $app-direction: multi; in variable.scss file.

and used this code

this.plt.ready().then(() => {
      this.plt.setDir('rtl', true) 
      })

in app.component.

but now the slideshow images gon!

ltr slider
11

rtl slider
22

and this is slider code

<ion-row>
      <ion-slides pager autoplay="4000" loop="true" speed="1000" class="slides-container">
        <ion-slide *ngFor="let i of imageSlide">
          <ion-col col-12 col-sm-9 col-md-6 col-lg-4 col-xl-3>
            <div  class="shadow">
              <img src="{{i.img}}">
            </div>
          </ion-col>
        </ion-slide>
      </ion-slides>
    </ion-row>

please let me know if I’m missing something,