JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="myApp" ng-controller="Controller">
    <input type="text" ng-model="search" placeholder="絞込み">
    <ul>
        <li ng-repeat="data in list | filter:search | upper">
            No.{{data.id}} {{data.name}}
        </li>
    </ul>
</div>

JavaScript

angular.module("myApp", [])
    .filter("upper", function() {
        return function(input, options) {
            return input.map(function(data) {
                return {
                    id: data.id,
                    name: data.name.toUpperCase()
                };
            });
        };
    });

function Controller($scope) {
    $scope.list = [
        {
            id:1,
            name:"あいうえお"
        },
        {
            id:2,
            name:"かきくけこ"
        },
        {
            id:3,
            name:"あかさたな"
        },
        {
            id:4,
            name:"わをん"
        }
    ];
};