I want to use multiple IonicSlides that I added dynamically. But I can't use @viewChild. please suggest a way to resolve this problem.
Template.html :
<div *ngFor="let name of title;let i = index;">
    <ion-slides  id="something" #slides>
        //some code
    </ion-slides>
</div
Component.ts :
  @ViewChild('slides') slides: QueryList<Slides>;
  ....
  ngAfterViewInit(){
        setTimeout(()=>{
              alert(this.slides.toArray()); //this line rise error 
        }, 3000);
  }
Error :
_this.slides.toArray is not a function
With @ViewChild, we can inject any component or directive (or HTML element) present on the template of a given component onto the component itself.
ViewChildren is different from the ViewChild . ViewChild always returns the reference to a single element. If there are multiple elements the ViewChild returns the first matching element, ViewChildren always returns all the elements as a QueryList.
ViewChildlinkProperty decorator that configures a view query. The change detector looks for the first element or the directive matching the selector in the view DOM. If the view DOM changes, and a new child matches the selector, the property is updated.
Use @ViewChildren instead of @ViewChild , Read More
@ViewChild :
You can use ViewChild to get the first element or the directive matching the selector from the view DOM.
@ViewChildren :
You can use ViewChildren to get the QueryList of elements or directives from the view DOM.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With