javascript - How can I keep the parent from displaying when the child is filtered out? -

here repeater:

<div ng-controller="eventcontroller">     <div class="input-group" id="search">         <label>search:</label><input type="text" id="searchfield" class="form-control" ng-model="search" /><br />         <select id="searchbydate" class="form-control" ng-model="datefilter">             <option value="">filter month</option>             @{                 foreach (datetime month in viewbag.months)                 {                     <option value="@month.tostring("yyyy-mm")">@month.tostring("mmmm yyyy")</option>                 }             }         </select>     </div>     <div class="row" style="margin: 0; padding: 0" ng-repeat="datebegin in events|groupby:'datebegin'|filter: datefilter"><br />         <h2 style="padding: 0" margin: 0;>{{ datebegin | date:'medium' }}</h2><br />         <div class="row tablecell" ng-repeat="event in events | filter: { datebegin: datebegin } | filter: search">             <a href="/eventdetails/{{ event.id }}"><h1>{{ event.name }}</h1></a>             <p>{{ event.description }}</p>             <ul>                 <li>time begin: {{ event.timebegin }}</li>                 <li>duration: {{ event.duration }}</li>             </ul>         </div>     </div> </div>  <script type="text/javascript">     var myapp = angular.module('myapp', []);     function eventcontroller($scope, $http) {         $http({             method: 'get',             url: '//localhost:60009/api/event'         })         .success(function (data) {             $scope.events = data;         })         .error(function (data) {         });     }      var uniquedates = function (data, key) {         var result = [];         (var = 0; < data.length; i++) {             var value = data[i][key];             if (result.indexof(value) == -1) {                 result.push(value);             }         }         return result;     };      myapp.filter('groupby',             function () {                 return function (collection, key) {                     if (collection === null) return;                     return uniquedates(collection, key);                 };             }); </script> 

this works had hoped, minus bit of formatting. events grouped date, , date selector can filter months, , search box filters event details. here problem:

before filtering (looking good):

after filtering (empty dates still appear - in picture, want may 23 go away):

what can rid of empty dates? there can add filter?

i try in scenario ng-if="value !== emptyvalue" instead making , effort filtering "invalid data".

one of advantages of ng-if on ng-hide or ng-show removes element entirely additional html not kept on page.

or apply second filter data like:

datebegin in (events |filter:emptyevents) |filter: datefilter