Not scrolling about ngx-infinite-scroll HOT 21 CLOSED

hi.
I guess the project you're using doesn't compile modules from "node_modules" directory.
I'm working on publishing a es5 compiled code so it will work flawlessly.

from ngx-infinite-scroll.

@ocombe, care to help me wiring this module so it can be consumed as expected via npm?
I followed your article, but am getting error.

from ngx-infinite-scroll.

Sure, but I see a lot of stuff missing here:
no .gitignore, no .npmignore, no angular2-infinite-scroll.ts file at the root, no tsconfig.json, no angular peerDepedency in the package.json, no prepublish script, no typescript compiler.
Are you sure that you followed the article?

from ngx-infinite-scroll.

Hi @ocombe
I just pushed my latest changes.
One difference is that i put an index.js in the root - so the actual angular2-infinite-scroll.ts is in the 'src' directory.

from ngx-infinite-scroll.

Is there a reason for that ?
It means that people will have to consume your library from "angular2-infinite-scroll/src/infinite-scroll".

from ngx-infinite-scroll.

no reason.
I followed a non-typescript convention.

from ngx-infinite-scroll.

Ok, and is it ok with you that people import from "angular2-infinite-scroll/src/infinite-scroll" ? If so I think that you should remove the index.js at the root which doesn't do anything and then it should work.

from ngx-infinite-scroll.

i pushed another update - 20ac4af
updated the root to follow ng2-translate.
however - i'm still getting errors.

from ngx-infinite-scroll.

I just tested it myself and it works.
I think that this error looks like an error from your webpack config, not from the module in itself. It tries to load the js files with the ts loader.

from ngx-infinite-scroll.

yes - i'm trying it in Echoes project - https://github.com/orizens/echoes-ng2
and indeed - there's a ts-loader for ts files.
Do i need to specify a js-loader for js files?

from ngx-infinite-scroll.

I'm also getting a lot of duplicated "X" in console for d.ts files:

error TS2300: Duplicate identifier 'prototype'.

from ngx-infinite-scroll.

The duplicate errors comes from the fact that you're probably using npm link, they will go away once you really install from npm.
Thinking of it it's probably the same error for the ts-loader, since you're using npm link it will import the ts files from your repository instead of the js files.

from ngx-infinite-scroll.

well, i managed to solve it.
i unlink the npm, installed the latest version from npm (currently with your guidance - updated to 0.0.3) and it works as expected now.

in contrary to using:

import { InfiniteScroll } from 'angular2-infinite-scroll/angular2-infinite-scroll';

this directive can be consumed by:

import { InfiniteScroll } from 'angular2-infinite-scroll';

that is possible because of the "main" property in the package.json pointing as the root file.

@ocombe Thanks for assisting me :)
@prolink007 thanks for reporting - you can try now the directive - please note that only some of its original features are implemented now.

from ngx-infinite-scroll.

Ahh good to know for the "main" property, I gotta try that.

from ngx-infinite-scroll.

@orizens Updated to 0.0.3 and made the import change. It is still not scrolling with this implementation.

<div
     infinite-scroll
     [infiniteScrollDistance]="2"
     (scroll)="onScroll()">
    some stuff<br>
    asdfjasdk<br>
    asdfasdfa<br>
    dfasdfasdf<br>
    asdfasdfasd<br>
    fasdfasdfa<br>
    sdfasdfasdf<br>
    asdfadfadf<br>
    some stuff<br>
    asdfjasdk<br>
    asdfasdfa<br>
    dfasdfasdf<br>
    asdfasdfasd<br>
    fasdfasdfa<br>
    sdfasdfasdf<br>
    asdfadfadf<br>
    some stuff<br>
    asdfjasdk<br>
    asdfasdfa<br>
    dfasdfasdf<br>
    asdfasdfasd<br>
    fasdfasdfa<br>
    sdfasdfasdf<br>
    asdfadfadf<br>
    some stuff<br>
    asdfjasdk<br>
    asdfasdfa<br>
    dfasdfasdf<br>
    asdfasdfasd<br>
    fasdfasdfa<br>
    sdfasdfasdf<br>
    asdfadfadf<br>
    some stuff<br>
    asdfjasdk<br>
    asdfasdfa<br>
    dfasdfasdf<br>
    asdfasdfasd<br>
    fasdfasdfa<br>
    sdfasdfasdf<br>
    asdfadfadf<br>
</div>

from ngx-infinite-scroll.

hi @prolink007
it should be used as explained in the following http://sroze.github.io/ngInfiniteScroll/demo_basic.html
have a look at a working example with angular2 here - https://plnkr.co/edit/fh35HTLFP2uG8vcjcIe0?p=preview

from ngx-infinite-scroll.

@orizens The first link is for the old infinite scroll and is with an older version of angular. The second link does not infinitely scroll. It would be great if you could provide a couple examples with your library. A jsfiddle or something would be very good.

from ngx-infinite-scroll.

hi.
It does scroll - i updated the example - https://plnkr.co/edit/fh35HTLFP2uG8vcjcIe0?p=preview

from ngx-infinite-scroll.

@orizens I just tested your plnkr again.

I agree, it is scrolling. However, it is not infinitely scrolling. If i my scroll bar is at the bottom of the list and i attempt to continue scrolling, it does not continue to create content and scroll.

from ngx-infinite-scroll.

@orizens For me it is working for any div with fixed height. But it does not trigger the callback when I try window scroll.

I have also tried setting [scrollWindow]="true" explicitly but not luck. I am using Angular 2.1.0 and angular2-inifinite-scroll 0.2.8

Any idea?

from ngx-infinite-scroll.

hi @suresh121
please look at the demo https://plnkr.co/edit/DrEDetYnZkFxR7OWWrxS?p=preview

from ngx-infinite-scroll.