ngu-carousel length for carousel banner undefined

CarouselComponent.html:1 ERROR TypeError: Cannot read property 'length' of undefined at NguCarousel.push../node_modules/@ngu/carousel/fesm5/ngu-carousel.js.NguCarousel._carouselPoint (ngu-carousel.js:700) at NguCarousel.push../node_modules/@ngu/carousel/fesm5/ngu-carousel.js.NguCarousel._storeCarouselData (ngu-carousel.js:672) at NguCarousel.push../node_modules/@ngu/carousel/fesm5/ngu-carousel.js.NguCarousel._carouselSize (ngu-carousel.js:844) at NguCarousel.push../node_modules/@ngu/carousel/fesm5/ngu-carousel.js.NguCarousel._inputValidation (ngu-carousel.js:445) at NguCarousel.push../node_modules/@ngu/carousel/fesm5/ngu-carousel.js.NguCarousel.ngAfterViewInit (ngu-carousel.js:393) at callProviderLifecycles (core.js:9567) at callElementProvidersLifecycles (core.js:9541) at callLifecycleHooksChildrenFirst (core.js:9531) at checkAndUpdateView (core.js:10467) at callViewAction (core.js:10699)

Sep 10 '18 06:09 yashbhokare

Yes, I also have the same issue. I am trying to use <ngu-item NguCarouselItem> and not

Sep 10 '18 06:09 harishkrishnan24

@harishkrishnan24 @yash4596 Hi,

There is some process change in the carousel. Please look at this demo. Now i have decoupled the point from the carousel so that we can customize our own. It is requested by devs. Now carousel will have dataSource for data input instead of ngFor similar to Material components.

This is done for handling large number of items and will maintain less items in dom for performance improvement (in development)

Sep 10 '18 07:09 sheikalthaf

Having the same issue. Everything works fine when data is static. When data is fetched through @Input decorator, this error is thrown.

Sep 10 '18 15:09 emceearjun

@emceearjun Try to initialize your @input with empty array. This error occurs when you pass undefined value to dataSource.

Sep 10 '18 16:09 sheikalthaf

@sheikalthaf I use something like <ngu-carousel [inputs]="carouselBanner"> <ngu-item NguCarouselItem class="mySlides" *ngFor="let item of items">

Cant, we use this anymore?

Sep 11 '18 06:09 harishkrishnan24

@sheikalthaf yes it works. I was receiving null in the input which was causing the issue. Thanks! That being said, can null/undefined values be handled in a manner similar to an empty array? I think that would be useful since there will be consistency. Also, this error message is quite misleading.

Again, thanks :)

Sep 12 '18 14:09 emceearjun

@sheikalthaf I use something like <ngu-carousel [inputs]="carouselBanner"> <ngu-item NguCarouselItem class="mySlides" *ngFor="let item of items">

Cant, we use this anymore?

Angular ngFor is dropped. Please use the latest version of carousel logic. Please check the demo link above

Sep 12 '18 18:09 sheikalthaf

@sheikalthaf yes it works. I was receiving null in the input which was causing the issue. Thanks! That being said, can null/undefined values be handled in a manner similar to an empty array? I think that would be useful since there will be consistency. Also, this error message is quite misleading.

Again, thanks :)

Will do.. Thanks

Sep 12 '18 18:09 sheikalthaf

Can you use the latest version without specifying a datasource? I was previously using as follows but this now throws an error. According to the example on home page of repo this should still work.

I've recreated the issue here: https://stackblitz.com/edit/ngu-carousel-demo-qsvjke

<ngu-carousel [inputs]="carouselOne">
    <ngu-item NguCarouselItem>
      	step 1
    </ngu-item>
    <ngu-item NguCarouselItem>
      	step 2     
    </ngu-item>
    <button NguCarouselPrev class="leftRs">&lt;</button>
    <button NguCarouselNext class="rightRs">&gt;</button>
  </ngu-carousel>

TypeError: Cannot read property 'length' of undefined at NguCarousel.push../node_modules/@ngu/carousel/fesm5/ngu-carousel.js.NguCarousel._carouselPoint () at NguCarousel.push../node_modules/@ngu/carousel/fesm5/ngu-carousel.js.NguCarousel._storeCarouselData () at NguCarousel.push../node_modules/@ngu/carousel/fesm5/ngu-carousel.js.NguCarousel._carouselSize () at NguCarousel.push../node_modules/@ngu/carousel/fesm5/ngu-carousel.js.NguCarousel._inputValidation () at NguCarousel.push../node_modules/@ngu/carousel/fesm5/ngu-carousel.js.NguCarousel.ngAfterViewInit ()

Angular CLI: 6.1.3 Node: 8.11.3 OS: win32 x64 Angular: 6.1.2 ... animations, common, compiler, compiler-cli, core, forms ... language-service, platform-browser, platform-browser-dynamic ... platform-server, router

Package Version

@angular-devkit/architect 0.6.8 @angular-devkit/build-angular 0.6.8 @angular-devkit/build-optimizer 0.6.8 @angular-devkit/core 0.6.8 @angular-devkit/schematics 0.7.3 @angular/cdk 6.4.5 @angular/cli 6.1.3 @angular/flex-layout 6.0.0-beta.18 @angular/material 6.4.5 @angular/material-moment-adapter 6.4.5 @ngtools/webpack 6.0.8 @schematics/angular 0.7.3 @schematics/update 0.7.3 rxjs 6.3.2 typescript 2.9.2 webpack 4.8.3

Sep 15 '18 13:09 ImranAhmed

@ImranAhmed Hi,

Currently the carousel doesn't support static data. Soon i will update to support static data. If you want to use carousel as static then stick with previous version.

Thanks

Sep 15 '18 16:09 sheikalthaf

Hey 1.5.3 released. something happened about this issue?

Oct 17 '18 18:10 umutc

Do we have an update on this? Are the examples for static content on home page out of date and does this control even support loading static content anymore? Thanks.

Nov 25 '18 14:11 ImranAhmed

I am having the same issue. What version works with static content?

Jan 07 '19 22:01 matbalazsi

any update?

Feb 06 '19 11:02 gimox

@sheikalthaf Hi, you mention that if we wanted to use static data, we should use the previous version. May I know what is the version number that works with static content? Thanks