使用角度2无限滚动模块时面临问题

时间:2016-04-18 06:20:30

标签: angular angular2-directives

我正在使用Angular 2无限滚动模块,我使用的是模块页面中给出的相同代码,我仍面临着问题

  

“EXCEPTION:错误:未捕获(在承诺中):模板解析错误:   无法绑定到'infinitescrolldistance',因为它不是已知的原生属性(“灰色”>] [infinitescrolldistance] =“2”(滚动)=“onScroll()”class =“search-results”&gt ;“

我已将模块包含在component.ts中,如

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

以及指令路径。

当我删除infinitescrolldistance属性时,我正面临

  

“EXCEPTION:TypeError:无法读取null的属性'zone'。

以下是我的玉格式代码。能否帮我解决一下我所面临的问题。

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='', (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)")

2 个答案:

答案 0 :(得分:1)

注意:对于新用户,angular2-infinite-scroll现在为deprecated。您应该使用ngx-infinite-scroll代替。

您需要在module.ts导入导出模块,以便在注册组件的地方拥有子模块。 这通常是在我们使用共享模块或特定于路由的模块的情况下。

示例shared.module.ts

import { NgModule } from '@angular/core';
import {InfiniteScrollModule} from 'ngx-infinite-scroll';
import {SampleComponent} from './sample.component.ts';

@NgModule({
  declarations: [
    SampleComponent
  ],
  imports: [
    InfiniteScrollModule
  ],
  providers: [
  ],
  exports: [
    SampleComponent,
    InfiniteScrollModule
  ]
})
export class SharedModule { }

希望这有帮助!

答案 1 :(得分:0)

如果您绑定文字值,则不需要[],尤其是如果您收到此错误消息,则表示没有infinitescrolldistance属性

infinitescrolldistance='2',

[attr.infinitescrolldistance]="'2'"

用于显式属性绑定。