Angular js - Show message if ng-repeat is empty

Question

The following AngularJS application is working with ng-repeat and an applied filter. A certain applied filter leaves no values left. How can I display a notification?

<

Answer 1

I would go with very simple CSS approach:

HTML:

    
 #{{item.id}} Item
    
There are no matching items.

CSS:

li + .no-items {
    display: none;
}

So basically li.no-items is only visible if there are no other LI's and hidden otherwise. I think this is better for performance than introducing one more watcher with ngShow/ngHide.

Demo: http://jsfiddle.net/z9daLbLm/5/