Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

bug: IonSlides call ionSlidesDidLoad twice

See original GitHub issue

In my ionic-angular project i have a bug with “ion-slides”, i have an “ion-slides” inside a component that is loaded dynamically by angular router. First time that the page and component are loaded, “ion-slides” calls “ionSlidesDidLoad” once. When i change route and then i return to “ion-slides” route, after “ngOnInit”, “ionSlidesDidLoad” is called twice, if i repeat the route change this event is called ever twice.

Ionic version: [x] 5.0.0 Angular version: [x] 9.0.5 Current behavior: On “ionSlidesDidLoad” i call “lockSwipes” function, first time i load the page it works, after routing if i try to slide next or prev slide i can.

Expected behavior: I expect when “ion-slides” is loaded the “ionSlidesDidLoad” event is called once ever.

Related code:

<html>
    ...
        <ion-slides #mySlides (ionSlidesDidLoad)="myFunction(mySlides)">...</ion-slides>
    ...
</html>

<script>
    ....
    myFunction(slides) {
        slides.lockSwipes(true);
    }
    ....
</script>

Other information:

Ionic info:

Ionic:
    Ionic CLI: 6.2.0 (..\..\AppData\Roaming\npm\node_modules\@ionic\cli)
    Ionic Framework: @ionic/angular 5.0.4
    @angular-devkit/build-angular : 0.900.5
    @angular-devkit/schematics: 8.3.25
    @angular/cli: 9.0.5
    @ionic/angular-toolkit: 2.2.0

Capacitor:
    Capacitor CLI   : 1.5.1
    @capacitor/core : 1.5.1

Utility:
    cordova-res : not installed
    native-run  : 0.3.0

System:
    NodeJS : v10.16.0 (C:\Program Files\nodejs\node.exe)
    npm    : 6.13.7
    OS     : Windows 10

Issue Analytics

State:
Created 4 years ago
Comments:7 (2 by maintainers)

Top GitHub Comments

1reaction

bimarccommented, Mar 10, 2020

Adding ngIf to ion-slides and set it to true on “ngAfterViewInit” function, it works!!

In the future release this “bug” will be solved or this workaround is the only way?

0reactions

ionitron-bot[bot]commented, Apr 9, 2020

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Top Results From Across the Web

bug: IonSlides call ionSlidesDidLoad twice · Issue #20732

First time that the page and component are loaded, "ion-slides" calls "ionSlidesDidLoad" once. When i change route and then i return to "ion- ......

Ion-Slides: Mobile Touch Slider with Built-In & Custom Animation

The Slides component is a multi-section container. Each section can be swiped or dragged between. It contains any number of Slide components.

Why Did Ionic 4 Ion-Slides Suddenly Stop Displaying Properly?

Through more extensive bug testing, I found out that the problem was not with ion-slides, but actually with page loading.

[Resolved]-How to lock slides in Ionic 5 in React - appsloveworld

You can get a reference to your ion-slides element and call the lockSwipes method after the Swiper initialization using the ionSlidesDidLoad event:

Changelog - Ionic 5 Full Starter App

Linting is the process of analyzing your code for bugs, warnings, style and consistency changes, and more. In early 2019, TSLint was officially ......