I have an error in this, TypeError: _this.$instance.slick is not a function

[karthickmsobs]

Pls guide me.

ThumbSliderComponent.html:70 ERROR TypeError: _this.$instance.slick is not a function
at eval (ngx-slick.umd.js:78)
at ZoneDelegate.invoke (zone.js:388)
at Zone.run (zone.js:138)
at NgZone.runOutsideAngular (core.js:4708)
at SlickComponent.initSlick (ngx-slick.umd.js:70)
at SlickComponent.addSlide (ngx-slick.umd.js:113)
at SlickItemDirective.ngAfterViewInit (ngx-slick.umd.js:256)
at callProviderLifecycles (core.js:12748)
at callElementProvidersLifecycles (core.js:12715)
at callLifecycleHooksChildrenFirst (core.js:12698)

[tsams]

Same issue!!!

[MaciejWWojcik]

same

[jzfre]

same

[alcoceba]

Does anyone resolved it?

[Brone88]

same

[ParasShahh]

same issue any
Please suggest any other carousel for angular 7
Thanks

[arunnayak]

Can anyone suggest how to fix this?

[shansubra]

I had the same issue and this is how I fixed it.

Open the ngx-slick.umd.js file (which can be found in this location - node_modules\ngx-slick)
and find SlickComponent.prototype.initSlick function then inside this function this.zone.runOutsideAngular(function () { add this line

jQuery.noConflict();

and then replace these lines:

jQuery(_this.el.nativeElement)[0].innerHTML = '';
_this.$instance = jQuery(_this.el.nativeElement);

with these lines (i.e. change jQuery to $):

$(_this.el.nativeElement)[0].innerHTML = '';
_this.$instance = $(_this.el.nativeElement);

Hope this helps.

[phutaneVinayak]

@shansubra is we need to compile ngx-slick.umd.js again for minification or something else ?

[phutaneVinayak]

@shansubra thanks its solve the issue.

[paulpenafiel]

I had the same issue and this is how I fixed it.

Open the ngx-slick.umd.js file (which can be found in this location - node_modules\ngx-slick)
and find SlickComponent.prototype.initSlick function then inside this function this.zone.runOutsideAngular(function () { add this line

jQuery.noConflict();

and then replace these lines:

jQuery(_this.el.nativeElement)[0].innerHTML = '';
_this.$instance = jQuery(_this.el.nativeElement);

with these lines (i.e. change jQuery to $):

$(_this.el.nativeElement)[0].innerHTML = ''; _this.$instance = $(_this.el.nativeElement);

Hope this helps.

Thanks your solution solved my problem

[shansubra]

@paulpenafiel Glad that it worked for you.