Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support Angular 13 #515

Open
gloriousjob opened this issue Dec 18, 2021 · 26 comments
Open

Support Angular 13 #515

gloriousjob opened this issue Dec 18, 2021 · 26 comments

Comments

@gloriousjob
Copy link

Angular 13 enables Ivy and removes the View Engine. Please update dependencies and configs to support Angular 13.

The following warning shows during a compile:
⠙ Generating browser application bundles (phase: setup)...Processing legacy "View Engine" libraries:

NOTE: Someone has already opened a PR, which appears to be just running through the ng update's from where the code was at:
#514

@c-goldschmidt
Copy link

It looks a lot like this package has been abandoned. The last tag was Feb 2020 and there are no accepted pull request since Nov 2020.

@rintoj @speige @kykint are listed as maintainers but they all haven't interacted with this repository since 2020. I guess we'll have to look for an alternative, which is really sad, because this package is just the best for the job, as far as i know.

@nerumo
Copy link

nerumo commented Jan 28, 2022

@pjc2007
Copy link

pjc2007 commented Jun 25, 2022

Maybe now Angular 14

@iharbeck
Copy link

Currently working on Angular 14 version, waiting for fxLayout to be released for Angular 14 to complete final testing.

@lincolnthree
Copy link

lincolnthree commented Jun 27, 2022

@iharbeck Awesome! Keep us posted! Is there anywhere we can check out the progress?

@iharbeck
Copy link

iharbeck commented Jul 2, 2022

@lincolnthree @pjc2007
Just pushed a new release, please give it a try.

@iharbeck/ngx-virtual-scroller@14.0.4

https://www.npmjs.com/package/@iharbeck/ngx-virtual-scroller
https://github.com/iharbeck/ngx-virtual-scroller

@pjc2007
Copy link

pjc2007 commented Jul 12, 2022

Thankyou @iharbeck . I have updated this and Angular to 14. So far so good.

@pjc2007
Copy link

pjc2007 commented Jul 13, 2022

@iharbeck Actually, I just realised I did not point to the correct npm (@iharbeck/ngx-virtual-scroller@14.0.4)

I've now done that, deleted my node_modules, reinstalled, but am getting this error (in both IDE and when I compile)

image

Any ideas why this would be?

@iharbeck
Copy link

just change the import to @iharbeck as well. The IDE should fix it if you remove the import and use the code completion.

@pjc2007
Copy link

pjc2007 commented Jul 15, 2022

Thankyou again @iharbeck . The above worked and now have it incorporated, and all looks good my initial tests in my use case (our QA now be testing the app)

@joseluiz98
Copy link

joseluiz98 commented Jul 26, 2022

@lincolnthree @pjc2007 Just pushed a new release, please give it a try.

@iharbeck/ngx-virtual-scroller@14.0.4

https://www.npmjs.com/package/@iharbeck/ngx-virtual-scroller https://github.com/iharbeck/ngx-virtual-scroller

I'm having this error with that version :(

Error: ../condition/node_modules/ngx-virtual-scroller/virtual-scroller.d.ts:1:23 - error TS2688: Cannot find type definition file for 'tween.js'.

1 /// <reference types="tween.js" />

@iharbeck
Copy link

@joseluiz98

try to add following dependencies to your project:
"@tweenjs/tween.js"
"@types/tween.js"

@ewalddieser
Copy link

@iharbeck will your improvements be merged into this repo?

@iharbeck
Copy link

@ewalddieser the rintoj repository is not maintained anymore. You can use my fork instead.

@ewalddieser
Copy link

@iharbeck That's really cool. Is there a way for you to take over the main repo? So that people don't get confused and also could just install using npm install ngx-virtual-scroller

I'm currently evaluating this lib and so far it looks really promising. The requirement is to render really long documents (laws) where the chapters are loaded lazily. It works already nicely when normally scrolling up and down.

The difficulty is that user should also be able to quickly scroll hundreds of chapters up/down by dragging the scroll bar. I tried to solve that by creating placeholder chapter objects with estimated heights and then load the real chapters when they are scrolled into view. This works, but not good enough. The document then jumps back and forth awkwardly.

@marian-simonca
Copy link

I am really stuck in Angular 12 and it seems that @iharbeck's package supports only versions 13 and 14.
Do you guys have any idea what I could do?
Perhaps I'm asking stupid questions but my brain is fried from looking around for virtual scroll libraries for the whole day

@gloriousjob
Copy link
Author

gloriousjob commented Oct 21, 2022

@marian-simonca
Just use the @iharbeck/ngx-virtual-scroller package instead of ngx-virtual-scroller package, as the thread says. It’s the same but supporting angular 13/14. I’m keeping this issue open here so people are aware of the other package. If you really are stuck in 12, I want to say this repo worked for me. I think 13 was when something stopped working.

@whyboris
Copy link
Collaborator

@iharbeck thank you for your fork: https://github.com/iharbeck/ngx-virtual-scroller 🤝

I think we'll be able to get this repository updated sometime in the near future too 🤞 cheers!

@majora2007
Copy link

majora2007 commented Nov 22, 2022

@whyboris does this imply the maintainer is going to also update to Angular 15? I'm in the process of updating the code to Angular 14 (including strict typing) and was planning to raise a PR back to iHarbeck's repository. Should I retarget here or just let the maintainer take care of it?

Edit: I did raise a PR for Angular 14 (minus 2 lines which need help on).
iharbeck#1

@gloriousjob
Copy link
Author

gloriousjob commented Dec 17, 2022

@iharbeck I'm not sure what's happening on this repo but do you think you'll do Angular 15 in your fork?
Btw, you've made my life easier by providing the 14 version so keep up the good work!

@iharbeck
Copy link

@gloriousjob Just released version 15, please give a try.

@gloriousjob
Copy link
Author

Thanks, @iharbeck! Works well!

@ysk3a
Copy link

ysk3a commented Mar 24, 2023

@iharbeck thanks for the v15 fork!
i was wondering if you could look into the demo folder? of course if you time.

also, it seems like you need both ngx-virtual-scroller and @iharbeck/ngx-virtual-scroller to make it work?

I tried to open the demo folder in stackblitz but it seems like there is an issue with the path src/virtual-scroller in list-with-api.component.ts
https://stackblitz.com/github/iharbeck/ngx-virtual-scroller/tree/master/demo?file=src/app/lists/list-with-api.component.ts

opening rintoj's demo folder in stackblitz seemed to work fine though
https://stackblitz.com/github/rintoj/ngx-virtual-scroller/tree/master/demo?file=package.json

@lincolnthree
Copy link

There is another library (not a fork) that I think deserves a look:
https://github.com/lVlyke/lithium-ngx-virtual-scroll

It's actually quite simple, supports responsive changes to the viewport size very well, and is quite configurable. Just make sure you specify both [itemHeight] and [itemWidth], or it wont render more than one item.

I think with a little love, and maybe a few features brought over from this lib, this one has a LOT of potential. We are going to try it in our app and see how it goes.

@ichepurnoy
Copy link

ichepurnoy commented Jun 12, 2023

Dear @iharbeck, I tried your fork, and I have the following build error. Can you pls suggest a workaround?

Error: node_modules/@iharbeck/ngx-virtual-scroller/virtual-scroller.d.ts:148:29 - error TS2315: Type 'Tween' is not generic.
protected currentTween: tween.Tween<any>;

I'm on Angular 13.3.11. The folder of @types/tween.js does not contain d.ts file. It says, typings are now included inside "@tweenjs/tween.js". I played around, added them manually to my project, still wasn't able to fix it.
Tween is actually generic, so I do not know what's going on.
UPDATE: with installing Tween 20.0.3 and manually suppressing the error with // @ts-ignore I was able to build, and get the scroller kind of working. But what's wrong with the normal install procedure?

@iharbeck
Copy link

@ichepurnoy please add

"skipLibCheck": true,

in tsconfig.json

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests