페이지의 절반 부분에 더 많은 기능을로드하려고합니다. 그래서 나는 그 코드를 이온 스크롤 안에 넣었지만 어떻게 든 현재 구현은 작동하지 않습니다. 메서드가ion-scroll 내에서 ion-infinite-scroll이 작동하지 않습니다.
(ionInfinite)="doInfinite($event)"
이 아니고 로더 UI가 렌더링되지 않습니다. 그러나 내용이 이온 스크롤 대신 이온 컨텐트에 배치되면 동일한 구현이 효과적입니다.
<ion-content padding>
<ion-scroll scrollY="true" id="accountList" class="list-box">
<ion-list >
<ion-item *ngFor="let item of [1,2,3,4,5,6,7,8,9]">
<ion-icon ios="ios-add-circle" md="ios-add-circle" item-start color="secondary"></ion-icon>
Item1
<ion-buttons item-end>
<button ion-button clear icon-only color="orange">
<ion-icon ios="md-create" md="md-create" item-end ></ion-icon>
</button>
<button ion-button clear icon-only color="danger">
<ion-icon ios="md-close" md="md-close" item-end></ion-icon>
</button>
</ion-buttons>
</ion-item>
</ion-list>
<ion-infinite-scroll (ionInfinite)="doInfinite($event)">
<ion-infinite-scroll-content
loadingSpinner="bubbles"
loadingText="Loading more data...">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-scroll>
</ion-content>