Angular 2+ - check if Pipe returns an empty subset of original list

Question

I have a list of strings that I want to iterate through, but I want to be able to filter them using a search term. Like this:

Answer 1

If your purpose is just render an element than you could do with CSS query it self, i just fallowing Günter Zöchbauer code.

  
{{ item }}
  
"No matches"

CSS

div.empty {
  display:none;
}
div.empty:first-child {
  display:block;
}

.list div.empty {
  display: none;
}

.list div.empty:first-child {
  display: block;
}

If you hava record to display than

  
The first record.
  
The second record.
  
The third record.
  
"No matches"



If no record to show

  
"No matches"