search

mujtaba01 / ngx-owl-carousel

An angular2 (4) wrapper for jquery owl-carousel library with dynamic carousel item change detection
MIT License
70 stars 25 forks source link

owl.carousel.js:1658 Uncaught TypeError: Cannot read property 'fn' of undefined #3

Closed rainstormza closed 7 years ago

rainstormza commented 7 years ago

owl.carousel.js:1658 Uncaught TypeError: Cannot read property 'fn' of undefined at owl.carousel.js:1658 at Object. (owl.carousel.js:1695) at webpack_require (bootstrap 2c4170b…:52) at Object.Owl.Defaults.items (index.js:18) at webpack_require (bootstrap 2c4170b…:52) at Object.433 (main.ts:11) at webpack_require (bootstrap 2c4170b…:52) at Object.434 (app.component.ts:17) at webpack_require (bootstrap 2c4170b…:52) at Object.324 (src async:7) at webpack_require (bootstrap 2c4170b…:52) at Object.553 (main.bundle.js:181) at webpack_require (bootstrap 2c4170b…:52) at webpackJsonpCallback (bootstrap 2c4170b…:23) at main.bundle.js:1 (anonymous) @ owl.carousel.js:1658 (anonymous) @ owl.carousel.js:1695 webpack_require @ bootstrap 2c4170b…:52 Owl.Defaults.items @ index.js:18 webpack_require @ bootstrap 2c4170b…:52 433 @ main.ts:11 webpack_require @ bootstrap 2c4170b…:52 434 @ app.component.ts:17 webpack_require @ bootstrap 2c4170b…:52 324 @ src async:7 webpack_require @ bootstrap 2c4170b…:52 553 @ main.bundle.js:181 webpack_require @ bootstrap 2c4170b…:52 webpackJsonpCallback @ bootstrap 2c4170b…:23 (anonymous) @ main.bundle.js:1

lastest version still error like this

Edit : import jquery

rainstormza commented 7 years ago

2wkpl2n

but there is no carousel

my code

html

<owl-carousel [options]="{items: 3, dots: false, navigation: false}" [items]="images" [carouselClasses]="['owl-theme', 'row', 'sliding']"> <div class="item" *ngFor="let image of images;let i = index"> <div class="thumbnail-image" [ngStyle]="">

typescript

import { Component, ViewChild } from '@angular/core'; import {OwlCarousel} from 'ng2-owl-carousel';

@Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent { title = 'app works!'; @ViewChild('owlElement') owlElement: OwlCarousel

images: Array = [0,1,2,3,4,5,6,7,8,9,10];

fun() { this.owlElement.next([200]) //duration 200ms } }

mujtaba01 commented 7 years ago

Update scripts key in your angular-cli.json to include jQuery

"scripts": [ "../node_modules/jquery/dist/jquery.js" ]

http://ayoubgdah.com/blog/using-jquery-with-angular-2-angular-cli/

rainstormza commented 7 years ago

1488276937209

error was gone but data doesn't look like what I expect Is this about owl carousel css file ?

mujtaba01 commented 7 years ago

Yes you need to include owl carousel css file.

amitgaur208 commented 7 years ago

This issue not solved for me..