angular-deckgrid
angular-deckgrid copied to clipboard
Order by cards and not by columns?
I have 2 columns and when my screen is less than 768px it's only 1. Problem is when it's collapsed the order is like this column 1 column2
When it's not collapsed I have Card 1 - Card 2 Card 3 - Card 4... So I end up with card 1,3,2,4... Is there a way to achieve what I want with deckgrid?
THank you
i hope i understand you. You can change the $$create.Columns function.
The part looks like this:
angular.forEach(this.$$scope.model, function onIteration (card, index) {
var column = (index % self.$$scope.layout.columns) | 0;
if (!self.$$scope.columns[column]) {
self.$$scope.columns[column] = [];
}
card.$index = index;
self.$$scope.columns[column].push(card);
});
I think this is the interesting part for your:
var column = (index % self.$$scope.layout.columns) | 0;
You can do this: var column = 1; var cnt = 1; angular.forEach(this.$$scope.model, function onIteration (card, index) { var items_per_column = Math.floor(self.$$scope.model.length/self.$$scope.layout.columns); if(cnt <= items_per_column){ if (!self.$$scope.columns[column]) { self.$$scope.columns[column] = []; } card.$index = index; self.$$scope.columns[column].push(card); cnt++; }else{ column++; cnt = 1; if (!self.$$scope.columns[column]) { self.$$scope.columns[column] = []; } card.$index = index; self.$$scope.columns[column].push(card); cnt++; }
});