Infinite scroll do not work after calling api

Hi all,
I have a little (actually big :)) with infinitescroll. If I want to use it to load more data from api it does’t work. But if I use only example from docs, it works well.

  constructor() {
        this.loadData();
    }

    doInfinite(){
        console.log('Begin async operation');

       
    }

   loadData() {
        this.api.callRequest('bar/bar', 'get', {}).subscribe(
            (s) => {
                console.log(s);
                    },
            (e) => {
                console.log("some error")
            }
        )
    }

after this infinitescroll is not initialized.

Example from docs (after this infinitescroll is working):

    loadData(loading) {
        for (var i = 0; i < 30; i++) {
            this.items.push(this.items.length);
        }
    }



What can be wrong on my code? Thanks

And you are calling loading.complete() ?

Yes, sure. Whole function:

 doInfinite(infiniteScroll) {
        console.log('Begin async operation');
        this.api.callRequest('apiUrlToGetData', 'get', {}).subscribe(
            (s) => {
                console.log(s);
                for (let i of s.bars) {
                    this.items.push(i)
                }
                infiniteScroll.complete();
            },
            (e) => {
            }
        )
    }

EDIT: I have this in 3 tabs. An if I switch to another tab and back to firs. Infinitescroll is working :-/