Trying to use a filter on an ng-repeat (which was created in a creative way :))


#1

Hi there,

i’ve been working on a project where i needed to create a “gallery like” screen,
this is essentially a view of rows, and three items in each row

the content is being pulled from a backend, and as such it need to code to dynamically be able to scale as long as more items retrieved from the backend,

the problem i’m facing is that i can’t filter the list of items using a simple filter because the way i create the array is --> data-ng-repeat="i in range(companies.length)"

$scope.companies is essentially an array of objects, each object represents a company
[{…}, {…} …]

and here is the HTML simplified as much as i was able to,

<div class"row"
     data-ng-repeat="company in companies"
     data-ng-if="$index % 3 === 0">

  <div class="col col-33"
       data-ng-if="$index < companies.length">
       
       <img ng-src="img/buttons/{{ companies[$index].image }}">

  </div>
  
  <div class="col col-33"
       data-ng-if="$index < companies.length">
       
       <img ng-src="img/buttons/{{ companies[$index + 1].image }}">

  </div>
  
  <div class="col col-33"
       data-ng-if="$index < companies.length">
       
       <img ng-src="img/buttons/{{ companies[$index + 2].image }}">

  </div>

  </div>
</div>

are there any ideas of how can i filter the list by object property?
Thanks.


#2

i managed to do that this way

CSS:

.col {
    float: left
}

HTML:

<div ng-repeat="company in companies">
  <div class="col col-33">
       <img ng-src="img/buttons/{{ company.image }}">
  </div>
</div>