JSFiddle - React, Tailwind, and code Playground
HTML
<div ng-app="searchApp">
<div ng-controller="searchCtrl">
Search : <input type="text" ng-model="search"/>
<ul ng-repeat="country in countries | filter:search">
<li>{{country.name}}</li>
</ul>
<p ng-show="(countries | filter:search).length==0"> No search result</p>
</div>
</div>
JavaScript
var app = angular.module("searchApp",[]);
app.controller("searchCtrl", function($scope){
$scope.countries = [{id:1, name: "Afghanistan"},
{id:2, name: "Albania"},
{id:3, name: "Algeria "},
{id:4, name: "American Samoa "},
{id:5, name: "Andorra "},
{id:6, name: "Angola "},
{id:7, name: "Anguilla "},
{id:8, name: "Antigua & Barbuda "},
{id:9, name: "Argentina "},
{id:10, name: "Armenia "},
{id:11, name: "Aruba "},
{id:12, name: "Australia "},
{id:13, name: "Austria "},
{id:14, name: "Azerbaijan "},
{id:15, name: "Bahamas, The "},
{id:16, name: "Bahrain "}];
});