Comments (6)
ngx-ui-scroll v3.2.0-beta is available on npm. This release provides Routines experimental API. Details and example can be taken from the demo: https://dhilt.github.io/ngx-ui-scroll/#/experimental#routines.
Speaking of your case with pausing scroll event processing, I would expect you to write something like the following:
onScroll(handler) {
const myHandler = event => {
if (context.stop) { // see demo to get the consumer's context
return;
}
handler(event);
};
// below is a tweaked replica of the original Routines.onScroll implementation, see sources
const eventReceiver = this.settings.window ? window : this.viewport;
eventReceiver.addEventListener('scroll', myHandler);
return () => eventReceiver.removeEventListener('scroll', myHandler);
}
from ngx-ui-scroll.
If i could access "Workflow" that would be fine too i think. So i could just deregister/register the onScroll event
from ngx-ui-scroll.
@muchbetterug Okay, there are two options I see, that don't require any updates on the lib side.
- You may try to override
window.addEventListener
in your App. Definitely not for production. - Use the scroller core (vscroll) directly with no ngx-ui-scroll wrapper. The example can be taken from here: https://stackblitz.com/edit/vscroll-angular-integration-table-demo?file=src%2Fsc. There you have access to Workflow (and to Routines).
If we want to solve the issue on the scroller's end, we may consider the following options.
-
Expose the Routines class at the consumer (ngx-ui-scroll) level: https://github.com/dhilt/vscroll/tree/v1.5.5#5-routines. Like it was done in the demo from p.2 (so, POC can be done on top of p.2 demo).
Routines
hasonScroll
method that deals withwindow.addEventListener
, so you'd be able to interrupt processing of scroll events. I would avoid exposing Workflow, guessing Routines should be sufficient. -
And the last option is about updating the core, vscroll. As you suggested, there might be implemented pause/resume methods on the Adapter class. I'm not sure what exactly they should do, and here we may discuss... Also, you may try to implement it on top of this integration demo: https://stackblitz.com/edit/angular-ngx-ui-scroll-and-vscroll-integration?file=src%2Fvscroll%2Fclasses%2Fadapter%2Fprops.ts. It is a bit stale (2 years) and needs to be aligned with the latest versions of vscroll/ngx-ui-scroll. But it should be good for POC.
What do you think?
from ngx-ui-scroll.
Big thx!
- Possible, but as you stated, not for production
- Definitivly a solution. This would need a lot of rework like it seems
- My preferred solution, without touching the core
- pause should stop listening to the scroll event (especially if windowViewport is active). so there is only one ui-scroll listening to the window onscroll event). resume should restart to listen
I think 3. is ideal, as this wouldnt include touching the core. In the Routines.onScroll i can check, if a specific ui-scroll should process the scroll event. Or override temporaly a specific routine.onScroll to a noop function, if i want the ui-scroll to be inactive
So the main problem is, multiple ui-scrolls thats listen to window onscroll events. I cannot work with *ngIf, cause the ui-scrollers needs to stay initialized.
With the change in 3. i think i can solve this problem.
Thx, really!
from ngx-ui-scroll.
@muchbetterug Okay, I started implementing p3 in PR #350. Actually, p4 approach also seems very useful, maybe I'll do both, let's see.
from ngx-ui-scroll.
sorry for the late reply, this change works fantastically and is fearly simple, super!
i wish you all the best!!
from ngx-ui-scroll.
Related Issues (20)
- How to update startIndex after reseting data source. HOT 7
- What is the best practice to update an item within the list without flashing? HOT 2
- Smoothscrolling HOT 6
- Mouse wheel scrolling gets stuck on loading after updating Chrome (v102) HOT 2
- Item separation HOT 3
- Scroll position jumps/changes when new items are loaded in viewport HOT 2
- Data loading is abnormal when scrolling up HOT 6
- Nested cdkVirtualFor in cdk-virtual-scroll-viewport HOT 1
- Sluggish on iOS HOT 3
- Observable dataSource change (emission) does not update uiScroll list HOT 4
- remove\update\prepend does not work properly HOT 2
- Scrolling on item click when it's not fully visible in list HOT 2
- TypeError: Cannot read properties of undefined (reading 'log') HOT 5
- Angular 16 compatibility ? HOT 1
- Issue: adaptor.reload(reloadIndex) not functioning correctly on iOS HOT 11
- Object reference after appending HOT 2
- Is it possible to implement nested uiScroll? HOT 4
- Custom Routines
- Pause/resume methods
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from ngx-ui-scroll.