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