CODEWITHSUNDEEP
angularjsfirebase
Kapil Soni
Kapil Soni

Reputation: 1051

ng-repeat is commened in the browser Element section in AngularJs?

I have to call the firebase function for get the sellerProducts but in my case function is called peoperly and array is display in the element console but ng-repeat data is commented what is the problem in my code?

//FUNCTION FOR GET THE LIST OF PRODUCT'S
$scope.productArray   = [];	
	$scope.getProductData = function() {	              
  firebase.database().ref("sellerProduct").once('value').
       then(function(snapshot) {
		        var value = snapshot.val();
			      $scope.productArray = objToArray(value);
	    	});
	    }
	$scope.getProductData();
<div class="productInfo  w3-col m3  w3-card-4 w3-margin-left"  
ng-repeat="list in filtered  = (productArray | filter: product) | filter:brandFilter">
</div>

enter image description here

Upvotes: 0

Views: 32

Answers (1)

masterpreenz
masterpreenz

Reputation: 2290

As far as I could suggest it is much better to NOT use ng-filter at all inside a ng-repeat as it will cost you severe performance issue later on.

so instead of doing this:

ng-repeat="list in filtered  = (productArray | filter: product) | filter:brandFilter"

just simply use:

ng-repeat="list in productArray"

then in your JS code format the array first the way you wanted it to be displayed, before assigning it to $scope.productArray

.then(function(snapshot)
{
      var value = snapshot.val();
      // save the original array
      $scope.productArrayOrig = angular.copy(objToArray(value));
      $scope.productArray = $scope.filterByBrand();
  });
});

// then just create a function that filters your projectData by brandFilter
$scope.filterByBrand = function ()
{
    var finalData = [];

    if ($scope.productArrayOrig)
    {
        // then loop it
        for (var i = 0; i < $scope.productArrayOrig.length; i++)
        {
            var item = $scope.productArrayOrig[i];

            if ($scope.brandFilter == item["brand"])
            {
                finalData.push(item);
            }
        }
    }

    return finalData;
};

hope that helps

Upvotes: 1

Related Questions