ngInfiniteScroll not showing anything when changing source array

[md-rashid]

I have a bunch of products and am using infinite scroll to display them. It generally works very well if I dont change the array values. However, I have different types of products and have a filter that changes the firebase database endpoints and loads the new values to the array.

Changing back and forth will somehow make all the products disappear. Even though, I do see the products being added to the array from console.

Code:

Sample code for database end point change

function getProductByTag(tag) {
    if(lastSelection === tag && allproducts) {
        console.log('do nothing, we are good');
    } else if (lastSelection != tag) {
        lastSelection = tag;

        baseRef = firebaseDataService.root.child('products_' + tag.toLowerCase());
        scrollRef = new firebase.util.Scroll(baseRef, '$key');
        scrollRef.on('child_added', function(snap) {
           console.log('added child', snap.key);
        });

        scrollRef.scroll.next(5);

        allproducts = $firebaseArray(scrollRef);
        // store the scroll namespace on the array for easy ref
        allproducts.scroll = scrollRef.scroll;

    } else {
        console.log('We shouldnt be here');
    }

    return allproducts;
}

Front end code:

From the console, I do see the following:

product.service.js:60 added child -KRe4D4pi5uDncBQyeLN product.service.js:60 added child -KRe4OFAi3eYJEWGjMDv product.service.js:60 added child -KRe5-PrzaaBr5YzzlMA product.service.js:60 added child -KXlZL8bBzOjZ02DpCzW etc Any idea whats going on here ?

[graingert]

does firebaseDataService call $digest properly?

[md-rashid]

@graingert:

I have not done anything specific for calling $digest properly. Suggestions ?

This is what I have for the firebase data service:

(function () {

'use strict';

angular
    .module('app.core')
    .factory('firebaseDataService', firebaseDataService);

function firebaseDataService() {
    var root = firebase.database().ref();
    var service = {
        root: root,
        users: root.child('users')
    };
    return service;
}

})();

[graingert]

You should be using an angular binding for firebase.

On 5 Dec 2016 20:29, "ahsan87" notifications@github.com wrote:

@graingert https://github.com/graingert:

I have not done anything specific for calling $digest properly. Suggestions ?

This is what I have for the firebase database service:

(function () { 'use strict';

angular .module('app.core') .factory('firebaseDataService', firebaseDataService);

function firebaseDataService() { var root = firebase.database().ref(); var service = { root: root, users: root.child('users') }; return service; }

})();

— You are receiving this because you were mentioned.

Reply to this email directly, view it on GitHub https://github.com/sroze/ngInfiniteScroll/issues/346#issuecomment-264967632, or mute the thread https://github.com/notifications/unsubscribe-auth/AAZQTGG053_SyDHUb96rYiX3VWxEY5W4ks5rFHQVgaJpZM4LEoEi .

[md-rashid]

@graingert:

I believe angular binding for firebase is working properly.If values changes in firebase, I do see that reflected on my web page. I have been trying to call $scope.apply() but thats not helping.