anasash / ngx-scroll-event Goto Github PK

Hello, I've implemented the code as the documentation instructs, even using the div blah blah blah example in the documentation, the isWindowEvent is always true despite being called from an element.

The only difference I see is that I'm using templateUrl, not the template as suggested in the documentation. Any ideas?

Thank you for your work!

Hi,

first of all, Thank you for this module!

Situation:
I pull some items from an api and display them as a grid.
When i scroll down, it fetches the next item page from the api and appends it to the rendered data.

Problem:
When scrolling, the "reachingBottom"/"reachingTop" event get's emitted multiple times.
This causes to do the same API call multiple times that causes me to display item pages multiple times.

Example:

+--------------------+
Item 1
Item 2
Item 3
+--------------------+
Item 4
Item 5

Item 1-3 are in my Viewport and item 4/5 are my "buffer"
When scrolling down, the event gets emitted and calls my api:

...get("/page&after=5")

Since the events gets emitted faster than my api responds, the request will be send multiple times and my list looks like this:

Item 1
Item 2
Item 3
+--------------------+
Item 4
Item 5
Item 6
Item 7
+---------------------+
Item 8
Item 6
Item 7
Item 8
Item 6
Item 7
Item 8

Feature Request:
I would like to have an ability to limit the amount of events or "lock" them until unlocked.

Regards

HI Developers,
I'm trying to move my application from Angular 5 to 6, but while upgrading its throwing 5 errors related to peer dependencies.

Pls, let me know how can I fix those issue?

Angular 4

I would like to know if any version is compatible with angular 8, thanks

These import statements provided in readme file is not working for v2.0.2. My angular version is 10.2.x

import { NgxScrollEventModule } from 'ngx-scroll-event';
import { NgxScrollEvent } from 'ngx-scroll-event';

I had to change import statement like this:

import { NgxScrollEventModule } from 'ngx-scroll-event/dist/ngx-scroll-event';
import { NgxScrollEvent } from 'ngx-scroll-event/dist/ngx-scroll-event';

Then I have used it this way:

<div libScrollEvent (onscroll)="handleScroll($event)" [topOffset]="100">
  ...
</div>

Yet it is not working. Showing these error messages in browser console.

core.js:4442 ERROR TypeError: Cannot read property '11' of null
    at Module.ɵɵlistener (core.js:15053)
    at Object.NgxScrollEventDirective_HostBindings [as hostBindings] (ngx-scroll-event.js:38)
    at invokeHostBindingsInCreationMode (core.js:8209)
    at invokeDirectivesHostBindings (core.js:8189)
    at createDirectivesInstances (core.js:7540)
    at Module.ɵɵelementStart (core.js:14865)
    at UserResponseModuleItemComponent_div_0_Template (user-response-module-item.component.html:1)
    at executeTemplate (core.js:7511)
    at renderView (core.js:7318)
    at TemplateRef.createEmbeddedView (core.js:10116)
    
core.js:4442 ERROR Error: ASSERTION ERROR: Reached the max number of directives [Expected=> 1 != 1 <=Actual]
    at throwError (core.js:738)
    at assertNotEqual (core.js:694)
    at initTNodeFlags (core.js:8313)
    at resolveDirectives (core.js:8048)
    at elementStartFirstCreatePass (core.js:14803)
    at Module.ɵɵelementStart (core.js:14841)
    at UserResponseModuleItemComponent_div_0_Template (user-response-module-item.component.html:1)
    at executeTemplate (core.js:7511)
    at renderView (core.js:7318)
    at TemplateRef.createEmbeddedView (core.js:10116)

Hello,
Thank you for the recent & well timed update to this package. I just noted that the previous method of importing this library:
import { ScrollEventModule } from 'ngx-scroll-event';
no longer works and so went into the library metadata to find the exported equivalent is apparently now "NgxScrollEventModule".
The readMe still features the old name.
Thank you

Hi,
i am getting an error while doing ng update for angular9 app.
Error

Package "ngx-scroll-event" has an incompatible peer dependency to "@angular/compiler" (requires "^2.4.5" (extended), would install "10.0.8").

I have angular7 cli project and when trying to build with universal getting the following Error on console

Event is not defined
ReferenceError: Event is not defined
at D:\app2019\dev\customerapp\app\node_modules\ngx-scroll-event\src\scroll.directive.js:59:42
at Object. (D:\app2019\dev\customerapp\app\node_modules\ngx-scroll-event\src\scroll.directive.js:75:2)
at Module._compile (internal/modules/cjs/loader.js:689:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
at Module.load (internal/modules/cjs/loader.js:599:32)
at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
at Function.Module._load (internal/modules/cjs/loader.js:530:3)
at Module.require (internal/modules/cjs/loader.js:637:17)
at require (internal/modules/cjs/helpers.js:20:18)
at Object. (D:\app2019\dev\customerapp\app\node_modules\ngx-scroll-event\src\scroll.module.js:11:26)
at Module._compile (internal/modules/cjs/loader.js:689:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
at Module.load (internal/modules/cjs/loader.js:599:32)
at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
at Function.Module._load (internal/modules/cjs/loader.js:530:3)
at Module.require (internal/modules/cjs/loader.js:637:17)

and i am using "ngx-scroll-event": "^1.0.8" version in package.json file.

any help to solve above error.

Module '"../../node_modules/ngx-scroll-event/ngx-scroll-event"' has no exported member 'ScrollEventModule'.ts(2305)

is there something else that let the scroll not scrollable

in my application, I have changed in TS, HTML and CSS file. But it is not calling Handle scroll event.
I am using 1.8 version of ngx-scroll.
Any different configuration also needed? My application code is in angular 5.
and also bottom offset and top offset is showing error like:-
for this <div this is not a property.

Currently, this package only supports vertical scrolling.
It need to support horizontal scrolling as well.

Hi
first of all, awesome work!
would love to know the scrolling direction: up or down whe event is fired.
thx

used in ngx-data table custom scroll - detect-scroll (onScroll)="handleScroll($event)"
handleScroll event is getting called after this function i'm seeing error. Attached console error
public handleScroll(event: ScrollEvent) {
console.log('scroll occurred', event.originalEvent);

}
version 1.0.8