1

I am using angularjs, ng-repeat to fill the required data in the datagrid.

Something like this:
<input type="text" placeholder="Search" ng-model="query">
<tr ng-repeat="item in items | filter:query">
  <td>{{item.someData}}</td>
  <td>{{item.someOthrData}}</td>
</tr>

when I enter some query string to filter the rows in the datagrid, at the end when the rows are filtered I need a callback, to do some application specific stuff.

Kindly if anyone can suggests what will be the right way to do this.

Thanks.

Hemal
  • 265
  • 1
  • 7
  • 17

1 Answers1

6

Try to use $watch method of the scope which detects changes of the defined expression. For your case, you need to watch "items" like:

scope.$watch('items', function() {
     console.log('Search key was entered');
});
Roger
  • 389
  • 2
  • 6
  • 3
    Items wouldn't change, he'd more likely need to watch "query". That should be sufficient. I would like some more information about the application specific stuff and why it needs to wait for the filter (which really only affects the view state and not the application state) is applied. – Daniel Tabuenca Nov 27 '13 at 23:55
  • 1
    Thanks Roger for you comments, that's what I needed "scope.$watch", but as rightly mentioned by dtabuenc, I needed to watch the query, Items would never change. Thanks you both of you!!! – Hemal Nov 28 '13 at 08:51
  • dtabuenc : kindly refer this question of mine, this is the actual problem that i was facing, and Yes its only affecting the view state. http://stackoverflow.com/questions/20243339/footable-along-with-angular-js – Hemal Nov 28 '13 at 08:54
  • if items is a deep object, you can use $scope.$watchCollection http://www.bennadel.com/blog/2566-scope-watch-vs-watchcollection-in-angularjs.htm – Asher May 21 '15 at 10:27
  • This does not look like the correct way for example if you have large number of items then the filtering will take time but the above function will respond fast – Saurabh Udaniya Oct 12 '15 at 09:20
  • This [post](http://stackoverflow.com/a/16001830/452708) an efficient way to handle Callback situation via a temporary Collection. `` Watch the same collection for change post filter operation `$scope.$watchCollection('filteredcars ', function() {});` – Abhijeet Feb 05 '16 at 11:48
  • Building on Abhijeet's comment, I have a very long list that is being filtered and I want a callback when that is completed so I used the ng-repeat 'as' keyword to save my filtered results 'as filtered'. I then used 'filtered' in my watchCollection. – EGHM Jul 17 '18 at 02:22