Ngx-infinite-scroll: facing issue while using infinite scroll distance

Created on 18 Apr 2016  路  5Comments  路  Source: orizens/ngx-infinite-scroll

Hi I am using angular 2 infinite scroll module, I am using the same code that has been given in the module page still I am facing issue as
"EXCEPTION: Error: Uncaught (in promise): Template parse errors:
Can't bind to 'infinitescrolldistance' since it isn't a known native property (" grey-color">

][infinitescrolldistance]="2" (scrolled)="onScroll()" class="search-results">"

I have included the module in component.ts like "import { InfiniteScroll } from 'angular2-infinite-scroll';" and also in directive path. Below is my code in jade format:

div(layout= "row")
div.md-whiteframe-6dp.white-color(flex="20",style="min-height:500px")
sd-sidenav
div.md-whiteframe-5dp.grey-color(flex="35" layout="column")
div(flex="90")
md-subheader.grey-color
.search-results(infinite-scroll='', [infinitescrolldistance]='2', (scrolled)='onScroll()')
md-list.carestream-listing.md-whiteframe-z2.md-margin.white-color(_ngFor ="#carecircle of carecircleMemberList; #index = index", (click)="showCareCircle(carecircle._id)" , [ngClass]="{pullright : activeItem === carecircle._id}")
div
md-list-item.md-2-line
img.md-avatar(style="border-radius:50%",src='./client/app/assets/images/defaultprofile.jpg', alt='Image')
.md-list-item-text(layout='row')
div(flex='80')
h3 {{carecircle.firstName}} {{carecircle.lastName}}
//p {{carecircle.status}}
div(layout='row',flex='20',layout-align ='end end')
span(_ngIf='showMemberDeleteCheckbox')
md-checkbox.md-primary((click)="storeDeleteMember(carecircle, $event)")
div.md-padding(flex="10" layout="row" layout-align="end end")
button.md-fab.orbita-primary-bg-color.orbita-icon-shadow(md-fab='', (click)="addMember()")
i(class="material-icons") add circle

when I remove infinitescrolldistance property, I am facing "EXCEPTION: TypeError: Cannot read property 'zone' of null".

Can you please help me out to find out the issue that I am facing.

wontfix
Source
picture sharmilemurugaraj
👍1

Most helpful comment

This still doesn't work for me.. and for many others as well. [infiniteScrollDistance] will throw an error

Can't bind to 'infiniteScrollDistance' since it isn't a known property of 'div'.

picture azrinsani on 6 Jan 2018
👍3

All 5 comments

can you please tell me where I am going wrong?

sharmilemurugaraj picture sharmilemurugaraj on 18 Apr 2016

hi @sharmilemurugaraj
attribute should is case sensitive:

[infiniteScrollDistance]="2"
orizens picture orizens on 26 Apr 2016

This still doesn't work for me.. and for many others as well. [infiniteScrollDistance] will throw an error

Can't bind to 'infiniteScrollDistance' since it isn't a known property of 'div'.

azrinsani picture azrinsani on 6 Jan 2018
👍3

@azrinsani Did you import the module inside the app.module.ts file? 

import { InfiniteScrollModule } from 'ngx-infinite-scroll';

imports:[ InfiniteScrollModule ]
Suwadith picture Suwadith on 19 Feb 2018

I've imported the module in app.module.ts @Suwadith .Still giving above error. Can you help ??

SimranChawla1995 picture SimranChawla1995 on 18 Jan 2019
Was this page helpful?
0 / 5 - 0 ratings

Related issues

tuckerjt07 picture tuckerjt07  路  6Comments
Jvick13 picture Jvick13  路  5Comments
iozozturk picture iozozturk  路  5Comments
Tsoko picture Tsoko  路  7Comments
atineo picture atineo  路  5Comments