akoenig / angular-deckgrid

A lightweight masonry-like grid for AngularJS.
http://akoenig.github.io/angular-deckgrid
MIT License
1.1k stars 191 forks source link

Update angular-deckgrid.js to support filtering #88

Open andremann opened 9 years ago

andremann commented 9 years ago

I proposed a patch adding filtering capabilities to your great directive. I hope it works fine for you. As i wrote in a previous message on issue https://github.com/akoenig/angular-deckgrid/issues/39 Basically I injected $filter dependency in the module and used it in

Deckgrid.prototype.$$createColumns = function $$createColumns () { 
    /*...*/
    angular.forEach($filter('filter')(this.$$scope.model, this.$$scope.filter), function onIteration (card, index) { /*...*/ }
    /*...*/
}

in order to filter source attribute by a new directive attribute (called filter) for which I registered a new watcher

filterWatcher = this.$$scope.$watchCollection('filter', this.$$onModelChange.bind(this));
this.$$watchers.push(filterWatcher);

Apologies for any inconvenience.. I'm a github newbie..

svennela commented 9 years ago

@andremann Do you have any samples on how to use filters? Please let me know.

andremann commented 9 years ago

Sure! As I wrote in my last message, with my PR I introduced a new attribute to the deckgrid directive called filter. So, in an angular view of mine, I just coded <input type="text" class="form-control ng-pristine ng-valid" ng-model="controlsExplorer.controlFilter" placeholder="Filter by...">

and a few lines below I use such a model for filtering purposes <div class="deckgrid" deckgrid source="controlsExplorer.controls" filter="controlsExplorer.controlFilter" cardTemplate="partials/decker-control-card.html"></div>

I hope this answers your question.

kevinclchung commented 9 years ago

It should be worth noting that this change would make angular-deckgrid support the standard angular filter, called "filter," and would expect an ng-model as its value (string). It would not allow it to support custom filters.

Nice work, though. Simple and clean.

andremann commented 8 years ago

Thanks @kevinclchung !

I kept it simple as my needs were quite straightforward. Of course it would be nice supporting custom filtering implementations.