Create slides dynamically

Ionic Framework Ionic Angular
1

Hi everyone, I have a problem.
I have a blank page and I would like to put one or more slides based on the response from the web service.
I inserted a div in the page with the [innerHTML] attribute

<div [innerHTML]="variableTextHtml"></div>

and into file.ts I call a webservice and I set the variableTextHtml with:

<ion-slides pager='true' autoplay="5000" loop="true" speed="3000">
                <ion-slide>
                  <h1>Slide 1</h1>
                </ion-slide>
etc.. etc..

When i run the app, slide doesn’t work.
How can I dynamically add components to the app’s html page?
Thank you

2

I would suggest to look into the swiper js framework as ionic is not going to support ion slides in the next versions. They have examples on how to add slides dynamically.

3

Thanks but I think I will have the same problem.
In the examples, the slider is always inserted into the template.
Instead, I start from a blank page and if the web service gives me certain information then I have to create it.
My problem is how to insert a component (for example the slider) from the .ts file into the html template

4

If you want to create dynamically slider so you have to use ngfor loop with your data array not innerHTML or js Dom it’s totally time waste it will never work