1

У меня есть куча продуктов, и я использую бесконечный свиток для их отображения. Он обычно работает очень хорошо, если я не изменяю значения массива. Однако у меня есть разные типы продуктов и фильтр, который изменяет конечные точки базы данных firebase и загружает новые значения в массив.ngInfiniteScroll не показывает ничего при смене исходного массива

Изменение взад и вперед каким-то образом приведет к исчезновению всех продуктов. Несмотря на это, я вижу, что продукты добавляются в массив из консоли.

Код:

Пример кода для конечной базы данных изменения точки

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; 
    } 

Firebase Service Data Код:

(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; 
    } 
})(); 

Передний конец Код:

<div infinite-scroll="vm.products.scroll.next(10)" infinite-scroll-distance="1"> 
    <div class="floating-box" ng-repeat="product in vm.products" ng-if="product.visibility"> 
    <!--some code--> 
    </div> 
</div> 

От Consol e, я вижу следующее:

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 

Любая идея, что происходит здесь?

+0

@Frank van Puffelen: Похоже, мне нужно сделать $ digest или $ apply. Какие-либо предложения ? – Ahsan

+0

Можете ли вы опубликовать свой код просмотра? Я хотел бы видеть, как вы связываете vm.products. –

ответ

1

Я добавил вызов к моему object.NextPage(), как это:

завода код:

var factory= function (dto) { 
    this.items = []; 
    this.busy = false; 
    this.after = 0; 
    this.dto= dto 
}; 

factory.prototype.nextPage = function() { 
    if (this.busy) return; 
    this.busy = true; 
    var url = serviceBase + '/api/ApiWebPage'; 
    this.dto.Inicio = this.after + 1; 
    this.dto.Fin = this.after + 8; 
    $http.post(url, this.dto).success(function (data) { 
    this.items = this.items.concat(data.Datos); 
    this.after = this.after + 8; 
    this.busy = false; 
    }.bind(this)); 
}; 

контроллер код:

$scope.initializer = function() { 
    var dto = {}; //params to initializer view 
    $scope.Factory = new Factory(dto); 
}; 

// Here its whe my source changues 
$scope.FilterFunction = function() { 
    var dto = {}; //params to filter 
    $scope.Factory = new Factory(dto); 
    $scope.Factory.nextPage(); 
}; 

HTML код:

<div infinite-scroll='Factory.nextPage()' infinite-scroll-disabled='Factory.busy' infinite-scroll-distance='1'> 
    <div ng-repeat="item in Factory.items"> 
    </div> 
</div>