# Ionic infinite-scroll not working with tabs

**URL:** <https://forum.ionicframework.com/t/ionic-infinite-scroll-not-working-with-tabs/85659>\
**Category:** ionic-v3\
**Created:** [April 6, 2017, 4:17pm UTC](https://forum.ionicframework.com/t/ionic-infinite-scroll-not-working-with-tabs/85659 "2017-04-06T16:17:21Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![richardmarais](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/richardmarais/32/101456_2.png) [@richardmarais](https://forum.ionicframework.com/u/richardmarais)\
**Post date:** [April 6, 2017, 4:17pm UTC](https://forum.ionicframework.com/t/ionic-infinite-scroll-not-working-with-tabs/85659/1 "2017-04-06T16:17:21Z")

</div>

I am using Ionic2.

Your system information:

```
Cordova CLI: 6.4.0 
Ionic Framework Version: 2.3.0
Ionic CLI Version: 2.1.18
Ionic App Lib Version: 2.1.9
Ionic App Scripts Version: 1.1.4
ios-deploy version: Not installed
ios-sim version: Not installed
OS: macOS Sierra
Node Version: v6.9.4
Xcode version: Xcode 8.3 Build version 8E162

```

I have an [infinite scroll](https://ionicframework.com/docs/api/components/infinite-scroll/InfiniteScroll/) which works perfectly, loading 15 items at a time. As I scroll down, it loads another 15 and so on:

```
     ...
  </ion-list>

  <ion-infinite-scroll id="infinite-scroll-search" (ionInfinite)="doInfinite($event)">
    <ion-infinite-scroll-content id="infinite-scroll-content-search"></ion-infinite-scroll-content>
  </ion-infinite-scroll>

```

However, I then add [tabs](https://ionicframework.com/docs/api/components/tabs/Tabs/), including my original page:

```
<ion-tabs>
  <ion-tab [root]="tab1Root" tabTitle="Page1" tabIcon="person"></ion-tab>
  <ion-tab [root]="tab2Root" tabTitle=Page2" tabIcon="heart"></ion-tab>
  <ion-tab [root]="tab3Root" tabTitle=Page3" tabIcon="briefcase"></ion-tab>
</ion-tabs>

```

The tabs work correctly, displayed at the bottom of the page. However, the `doInfinite($event)` function is not called when I scroll down as it did before the tabs were added. As a result, it does not load more than 15 rows.

It appears as if the tabs have affected the pages scroll event. Scrolling to the bottom does not fire the `ionInfinite` event and invoke the `doIninite($event)` anymore.

The first time the page loads the infinite scroll works, but if I click on the tab icon to load the page, then the `ionInfinite` event doesn’t work. So it may be related to how the tab is trying to cache the data or something.

Has anyone else experienced this problem? Does anyone have any ideas how I can debug this?

Any help appreciated.

---

<div class="post-metadata">

**Author:** ![richardmarais](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/richardmarais/32/101456_2.png) [@richardmarais](https://forum.ionicframework.com/u/richardmarais)\
**Post date:** [April 6, 2017, 4:46pm UTC](https://forum.ionicframework.com/t/ionic-infinite-scroll-not-working-with-tabs/85659/2 "2017-04-06T16:46:24Z")

</div>

I fixed this issue by loading the item array in `ionViewDidLoad` instead of `ionViewWillEnter`.

---

<div class="post-metadata">

**Author:** ![Warlok](https://avatars.discourse-cdn.com/v4/letter/w/7bcc69/32.png) [@Warlok](https://forum.ionicframework.com/u/Warlok)\
**Post date:** [August 11, 2017, 3:10pm UTC](https://forum.ionicframework.com/t/ionic-infinite-scroll-not-working-with-tabs/85659/3 "2017-08-11T15:10:24Z")

</div>

My ionViewDidLoad load first time, case change other tab and return don’t load ionViewDidLoad.