Customizing angular filter functionality - angularjs

Question

I am struggling in writing simple logic.
Please have a look and see if you can help me.
I have following code which shows three tables on UI at the moment based on data im returning from server.
I have search box which filter data in each table. It is also working fine.
My requirement:
I need to show one generic message "No data found" when no data found in all three tables based on input.
<div>
<input type="text" ng-model="searchStudent">
<div>
<div ng-repeat="studentPermissions in studentPermissions">
<div ng-repeat="student in studentPermissions.entities">
<table>
<thead>
<tr>
<td >Student</td>
<td>{{student.StudentName}}</td>
</tr>
<tr>
<th></th>
<th ng-repeat="permission in student.entityStudents[0].userPermissions"><div><span>{{permission.Name}}</span></div></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="student in student.entityStudents | filter:searchStudent">
<td>{{student.FirstName}} {{student.LastName}}</td>
<td ng-repeat="permission in student.userPermissions">
<input ng-model="permission.Checked" type="checkbox">
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
I have written search method in controller.
$scope.search = function (item) {
if ($scope.searchUser == null || $scope.searchStudent.trim() == "")
return true;
if (item.FirstName.toLowerCase().indexOf($scope.searchStudent.toLowerCase()) != -1 || item.LastName.toLowerCase().indexOf($scope.searchStudent.toLowerCase()) != -1 || item.Role.toLowerCase().indexOf($scope.searchStudent.toLowerCase()) != -1) {
return true;
}
return false;
};
I tried by setting flag on /off tricks but each time ended up something wrong.
My Sample Data:
$scope.studentPermissions = [
{entities[{StudentName: 'Tester', entityStudents[{FirstName: 'Test0', LastName: 'Test0', userPermissions[{prop 1, prop2, prop3}]}]}]},
{entities[{StudentName: 'Tester', entityStudents[{FirstName: 'Test1', LastName: 'Test2', userPermissions[{prop 1, prop2, prop3}]}]}]},
{entities[{StudentName: 'Tester', entityStudents[{FirstName: 'Test3', LastName: 'Test4', userPermissions[{prop 1, prop2, prop3}]}]}]},
]

Answer 1

You can use ngIf/ngShow/ngHide/ngClass for this, but you have to slightly change the way you write your repeat. For example, you can write it like this:
ng-repeat="student in filteredData = (student.entityStudents | filter:searchStudent)">
You can also do:
ng-repeat="student in student.entityStudents | filter:searchStudent as filteredData"
So, now you have a reference to the filteredData and you can just use filteredData.length in your ngShow/Hide/If/Class as the boolean. If it's length is 0 it will be falsy:
<p ng-hide="filteredData.length">No Data Found</p>
Here's a working demo, which I think matches your requirements, as best I can tell. Note that I moved your filter to the first nested repeat so that the tables were fully hidden if they didn't match and you only have one "No Data Found" message.
Updated Plunker