React - table with search and sort

Create a table in React and adding search filter and sort

<script src="./Scripts/angular.min.js"></script>
<div ng-app="myApp">
    <div id='controlerID' ng-controller='myControllerARR' style='padding-top: 10px;'>
        <div style='float: left'>Search:
            <input type='text' ng-model='searchCriteria' style='padding: 0px 6px!important;' />
        </div>
        <div style='float: right'>Order by:   
            <select ng-model='SortOrder' style='margin-bottom: 0px;'>
                <option value='+Nome'>Nome (asc)</option>
                <option value='-Nome'>Nome (dec)</option>
                <option value='+City'>City (asc)</option>
                <option value='-City'>City (dec)</option>
            </select>
        </div>
        <br />
        <br />
        <div class='divResults'>
            <table style="width: 100%; text-align: left;">
                <thead>
                    <tr>
                        <th>Nome</th>
                        <th>City</th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-click='showMoreInfo(pr.ID_Pessoa)' ng-repeat='pr in infoData | filter:searchCriteria  | orderBy:SortOrder'>
                        <td>{{pr.Name}}</td>
                        <td>{{pr.City}}</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
    <script>
        var idOpen = 0;
        var myApp = angular.module('myApp', []);
        myApp.controller('myControllerARR', function ($scope) {
            var dataArray = new Array;
            dataArray.push({ 'Name': 'Name of the person', 'City': 'Lisbon' });
            dataArray.push({ 'Name': 'Name of the second person', 'City': 'Braga' })
            $scope.infoData = dataArray; $scope.SortOrder = '+Name';
        });
    </script>
</div>